G.C.E. A/L ICT Unit 10.6-10.8 Tamil | PHP, MySQL & Web Publishing A/L ICT Tamil, Unit 10 PHP MySQL, Web Development Tamil, HTML Forms GET POST, Database Connectivity, Web Hosting, GCE AL ICT 2026

💻 G.C.E. A/L ICT (தமிழ் ஊடகம்)

Unit 10.6 - 10.8: Web Authoring, PHP, MySQL & Publishing

📌 இந்தப் பாடத்தின் நோக்கம்: Competencies 10.6, 10.7 & 10.8-ல் Web Authoring Tools, Static vs Dynamic Web Pages, PHP Basics, HTML Forms, GET/POST, MySQL Database Connectivity மற்றும் Website Publishing ஆகியவற்றை Theory, Code Examples, மற்றும் Exam Q&A வடிவில் எளிமையாகக் கற்றுக்கொள்ளலாம்.

10.6

Web Authoring Tool & WYSIWYG

Web Authoring Tool: Web Pages-ஐ உருவாக்கவும், திருத்தவும், நிர்வகிக்கவும் பயன்படுத்தப்படும் மென்பொருள் (எ.கா: Adobe Dreamweaver, Visual Studio Code, KompoZer).

WYSIWYG: "What You See Is What You Get". திரையில் நாம் காணும் வடிவமே இறுதியாக Web Page-ல் தோன்றும் வடிவமாக இருக்கும்.

நன்மைகள்: Web Development எளிதாகிறது, வேகமாக உருவாக்கலாம், Visual Editing, Code Assistance (Syntax Highlighting, Auto-completion).

Static vs Dynamic

Static vs Dynamic Web Pages

Static Web Page	Dynamic Web Page
முன்கூட்டியே நிர்ணயிக்கப்பட்ட தகவல்கள்	User Input/Database அடிப்படையில் மாறும்
Developer மாற்றும் வரை மாறாது	நேரம், User Action அடிப்படையில் உருவாகும்
HTML மட்டும் போதும்	PHP, MySQL, JavaScript தேவை

Architecture

Dynamic Website Architecture Flow

USER → Web Browser → HTTP Request → Web Server
                                          ↓
                                        PHP
                                          ↓
                                -------------------
                                ↓                 ↓
                            Processing          MySQL
                                                  ↓
                                               Database
                                                  ↓
                                                Result
                                                  ↓
                                                 PHP
                                                  ↓
                                             HTML Output
                                                  ↓
                                            Web Browser
          

PHP Basics

PHP Variables & Data Types

PHP Variable எப்போதும் $ குறியீட்டுடன் தொடங்கும்.

<?php
$name = "Kamal";      // String
$age = 18;            // Integer
$marks = 85.5;        // Float
$passed = true;       // Boolean

echo "Name: " . $name; // String Concatenation (.)
?>
          

Arrays

PHP Arrays (Indexed & Associative)

Indexed Array:

$students = array("Kamal", "Nimal", "Sunil");
echo $students[0]; // Output: Kamal (Index starts at 0)
          

Associative Array:

$student = array("name" => "Kamal", "age" => 18);
echo $student["name"]; // Output: Kamal
          

Control

Control Structures (if, else, loops)

// if...elseif...else
$marks = 75;
if ($marks >= 75) {
    echo "A";
} elseif ($marks >= 65) {
    echo "B";
} else {
    echo "S";
}

// for Loop
for ($i = 1; $i <= 5; $i++) {
    echo $i; // Output: 12345
}

// foreach Loop (for Arrays)
$names = array("Kamal", "Nimal");
foreach ($names as $name) {
    echo $name;
}
          

Functions

PHP Functions

Code Reusability-க்காக Functions பயன்படுத்தப்படுகின்றன.

function add($a, $b) {
    return $a + $b;
}
$result = add(10, 20);
echo $result; // Output: 30
          

Form Elements

முக்கிய HTML Form Elements

• Text: <input type="text" name="username">
• Password: <input type="password" name="pass">
• Radio: (ஒரு Option மட்டும்) <input type="radio" name="gender" value="Male"> (ஒரே name இருக்க வேண்டும்)
• Checkbox: (பல Options) <input type="checkbox" name="subject" value="ICT">
• Select: <select name="district"><option value="Colombo">Colombo</option></select>
• Fieldset: Related controls-ஐ group செய்ய <fieldset> மற்றும் <legend> பயன்படும்.

GET vs POST

GET vs POST Method (மிக முக்கியம் ⭐)

GET Method	POST Method
Data URL-ல் காணப்படும்	Data Request Body-ல் அனுப்பப்படும்
Search/Retrieval-க்கு ஏற்றது	Data Submission (Login/Register)-க்கு ஏற்றது
URL-ஐ Bookmark செய்யலாம்	Form Data பொதுவாக Bookmark செய்யப்படாது
Password-க்கு பொருத்தமானது அல்ல	Password போன்ற sensitive data-க்கு விரும்பத்தக்கது
URL Length வரம்பு உள்ளது	பெரிய Data-க்கு சிறந்தது

PHP Processing

PHP மூலம் Form Data பெறுதல்

// HTML Form
<form action="process.php" method="post">
    <input type="text" name="name">
    <input type="submit" value="Submit">
</form>

// process.php
<?php
$name = $_POST["name"]; // method="post" → $_POST
echo "Name: " . $name;
?>
          

🎯 நினைவில் வைக்க: method="get" → $_GET | method="post" → $_POST

MySQL Basics

Database அடிப்படை சொற்கள்

• Database: தொடர்புடைய Data-களின் தொகுப்பு.
• Table: தொடர்புடைய Records-ஐ சேமிக்கும் அமைப்பு.
• Row/Record: ஒரு முழுமையான Data Record.
• Column/Field: ஒரு குறிப்பிட்ட Attribute (எ.கா: Name, Age).
• Primary Key: ஒவ்வொரு Record-ஐ தனித்துவமாக அடையாளம் காணும் Field (எ.கா: StudentID).

SQL Commands

முக்கிய SQL Commands (CRUD)

-- 1. CREATE Database & Table
CREATE DATABASE school;
USE school;
CREATE TABLE student (
    id INT PRIMARY KEY,
    name VARCHAR(50),
    age INT
);

-- 2. INSERT (Add Data)
INSERT INTO student (id, name, age) VALUES (1, 'Kamal', 18);

-- 3. SELECT (Retrieve Data)
SELECT * FROM student;
SELECT name, age FROM student WHERE id = 1;

-- 4. UPDATE (Modify Data)
UPDATE student SET age = 19 WHERE id = 1;

-- 5. DELETE (Remove Data)
DELETE FROM student WHERE id = 1;
          

⚠️ எச்சரிக்கை: DELETE FROM student; என்று WHERE இல்லாமல் கொடுத்தால் Table-ல் உள்ள அனைத்து Records-களும் நீக்கப்படும்!

Connectivity

PHP & MySQL Connectivity

<?php
// 1. Connection உருவாக்குதல்
$conn = new mysqli("localhost", "root", "", "school");

// 2. Connection சரிபார்த்தல்
if ($conn->connect_error) {
    die("Connection failed");
}

// 3. Form Data-வை Save செய்தல் (INSERT)
$name = $_POST["name"];
$age = $_POST["age"];
$sql = "INSERT INTO student (name, age) VALUES ('$name', '$age')";
$conn->query($sql);
echo "Data saved";

// 4. Database-லிருந்து Data பெறுதல் (SELECT)
$result = $conn->query("SELECT * FROM student");
while ($row = $result->fetch_assoc()) {
    echo $row["name"] . "<br>";
}
?>
          

Publishing

Local vs Internet Publishing

Local Publishing	Internet Publishing
Local Computer/Intranet-ல் இயங்கும்	Remote Server-ல் இயங்கி பொதுவாக அணுகக்கூடியது
XAMPP, WAMP போன்றவை பயன்படும்	Web Hosting Service தேவை
http://localhost/ மூலம் அணுகலாம்	Domain/Subdomain மூலம் அணுகலாம்
Development & Testing-க்கு மட்டும்	Production Website-க்கு

Steps

Internet Publishing படிகள்

1. Website உருவாக்குதல் & Local-ல் Test செய்தல்
2. Web Hosting Account பெறுதல்
3. Website Files (HTML, PHP, CSS, Images) Upload செய்தல்
4. MySQL Database உருவாக்கி Configure செய்தல்
5. Domain/Subdomain இணைத்தல்
6. Online Website-ஐ Test செய்தல்

Performance

Website Performance-ஐ பாதிக்கும் காரணிகள்

• Image/File Size: பெரிய Files Loading-ஐ மெதுவாக்கும் (Compress செய்ய வேண்டும்).
• HTTP Requests: அதிக Images/CSS/JS Files அதிக Requests தேவைப்படுத்தும்.
• Server Performance: Slow Server Response Time-ஐ அதிகரிக்கும்.
• Database Efficiency: திறமையற்ற SQL Queries (எ.கா: தேவையில்லாத SELECT *) மெதுவாக்கும்.
• Caching: அடிக்கடி பயன்படுத்தப்படும் Resources-ஐ சேமித்து வைப்பது வேகத்தை அதிகரிக்கும்.
• Bandwidth & Internet Speed: User-ன் Network வேகம்.

📝 A/L மாதிரி வினாக்கள்

Q1

Static மற்றும் Dynamic Web Page-க்கு இடையிலான வேறுபாட்டை விளக்குக.

விடை: Static Web Page முன்கூட்டியே நிர்ணயிக்கப்பட்ட தகவல்களைக் காட்டும். Dynamic Web Page என்பது User Input, Database அல்லது நேரம் போன்ற நிபந்தனைகளின் அடிப்படையில் உள்ளடக்கத்தை உருவாக்கும் அல்லது மாற்றும்.

Q2

GET மற்றும் POST இடையே இரண்டு வேறுபாடுகளைக் குறிப்பிடுக.

விடை: 1. GET-ல் Data URL-ல் காணப்படும், POST-ல் Request Body-ல் அனுப்பப்படும். 2. GET Search/Retrieval-க்கு ஏற்றது, POST Password போன்ற sensitive data submission-க்கு விரும்பத்தக்கது.

Q3

`school` என்ற பெயரில் Database மற்றும் `student` Table உருவாக்கும் SQL Command எழுதுக.

CREATE DATABASE school;
USE school;
CREATE TABLE student (
    id INT PRIMARY KEY,
    name VARCHAR(50),
    age INT
);
          

Q4

HTML Form-ல் User Name பெற்று `save.php`-க்கு POST method மூலம் அனுப்பும் Code எழுதுக.

<form action="save.php" method="post">
    Name: <input type="text" name="name">
    <input type="submit" value="Save">
</form>
          

Q5

Website Performance-ஐ பாதிக்கும் ஐந்து காரணிகளைக் குறிப்பிடுக.

விடை: 1. Image/File Size, 2. Server Performance, 3. HTTP Requests எண்ணிக்கை, 4. Database Query Efficiency, 5. Caching.

⚡ One-Minute Revision Sheet

🔥 முழு Flow மனதில் வைத்திருக்க:
HTML FORM → GET / POST → PHP → MySQL → SQL QUERY → DATABASE → PHP → HTML → BROWSER

🔑 Key Keywords:
WYSIWYG = What You See Is What Get
$_GET / $_POST = Form Data பெற
PRIMARY KEY = Unique Record Identifier
Local Publishing = XAMPP/WAMP (Testing)
Internet Publishing = Web Hosting + Domain

❓ அடிக்கடி கேட்கப்படும் கேள்விகள் (FAQ)

Q: WYSIWYG என்றால் என்ன? A: WYSIWYG என்பது 'What You See Is What You Get' என்பதன் சுருக்கம். இதன் பொருள், திரையில் நாம் காணும் வடிவமே இறுதியாக Web Page-ல் தோன்றும் வடிவமாக இருக்கும் என்பதாகும்.

Q: Static Web Page மற்றும் Dynamic Web Page-க்கு இடையிலான வேறுபாடு என்ன? A: Static Web Page முன்கூட்டியே நிர்ணயிக்கப்பட்ட தகவல்களைக் காட்டும். Dynamic Web Page என்பது User Input, Database அல்லது நேரம் போன்ற நிபந்தனைகளின் அடிப்படையில் உள்ளடக்கத்தை உருவாக்கும் அல்லது மாற்றும்.

Q: HTML Form-ல் GET மற்றும் POST method-க்கு இடையிலான வேறுபாடு என்ன? A: GET method-ல் Data URL-ல் காணப்படும் மற்றும் Search/Retrieval-க்கு ஏற்றது. POST method-ல் Data Request Body-ல் அனுப்பப்படும் மற்றும் Password போன்ற sensitive data submission-க்கு விரும்பத்தக்கது.

Q: PHP மூலம் MySQL Database-உடன் எவ்வாறு இணைப்பது? A: PHP-யில் `new mysqli("localhost", "username", "password", "database_name")` என்ற code-ஐப் பயன்படுத்தி MySQL Database-உடன் இணைப்பு உருவாக்கப்படுகிறது.

Complete G.C.E. A/L ICT Unit 10.5 (CSS - Style Sheets, Selectors, Formatting) and 10.6 (Web Authoring Tools) notes in Tamil with code examples and exam Q&A

🎨 G.C.E. A/L ICT (தமிழ் ஊடகம்)

Unit 10.5: CSS (Style Sheets) & Unit 10.6: Web Authoring Tools

📌 இந்தப் பாடத்தின் நோக்கம்: Unit 10.5-ல் CSS அடிப்படைகள், Selectors, Insertion Methods, Formatting மற்றும் Unit 10.6-ல் Web Authoring Tools பற்றி Theory, Examples, Code Blocks, மற்றும் Question & Answer வடிவில் எளிமையாகக் கற்றுக்கொள்ளலாம்.

10.5.1

Style Sheet / CSS என்றால் என்ன?

CSS = Cascading Style Sheets

HTML elements-ன் தோற்றம் (Appearance) மற்றும் வடிவமைப்பு (Formatting) ஆகியவற்றை கட்டுப்படுத்த பயன்படுத்தப்படும் விதிகளின் தொகுப்பு.

• HTML → Web page-ன் structure/content உருவாக்குகிறது
• CSS → Web page-ன் appearance/design மாற்றுகிறது

h1 {
    color: blue;
    font-size: 30px;
}

CSS Benefits

CSS இன் முக்கிய நன்மைகள்

• Web page-ன் design-ஐ எளிதாக மாற்ற முடியும்
• ஒரே Style-ஐ பல elements-க்கு பயன்படுத்த முடியும்
• Code duplication குறைகிறது
• Website maintenance எளிதாகிறது

10.5.2

CSS Syntax

selector {
    property: value;
}

பகுதி	பொருள்	உதாரணம்
Selector	எந்த element-க்கு style	p, h1
Property	எதை மாற்ற வேண்டும்	color, font-size
Value	எவ்வாறு மாற்ற வேண்டும்	red, 20px

p {
    color: red;
    font-size: 20px;
}

10.5.3

CSS Comments

CSS code-ஐ browser-ல் display செய்யாமல் developer-க்கு explanation எழுத பயன்படுகிறது.

/* This is a comment */

/* Heading style */
h1 {
    color: green;
    font-size: 30px;
}

⚠️ Exam Point: CSS comment → /* comment */ | HTML comment → <!-- comment -->

4 Types

நான்கு முக்கிய CSS Selectors

Selector	Symbol	பயன்பாடு	உதாரணம்
Element	None	Tag name மூலம்	p { }
ID	#	ஒரு specific element	#special { }
Class	.	பல elements-க்கு	.important { }
Group	Comma	பல selectors-க்கு	h1, h2, p { }

1. Element Selector

Element Selector

HTML element பெயரை நேரடியாக பயன்படுத்துவது.

p {
    color: blue;
}

h1 {
    color: red;
}

2. ID Selector

ID Selector (#)

HTML: <p id="special">Important Message</p>

#special {
    color: red;
    font-size: 25px;
}

🎯 நினைவில் வைக்க: ID → # (ஒரே ஒரு element-க்கு மட்டும்)

3. Class Selector

Class Selector (.)

HTML: <p class="important">Hello</p>

.important {
    color: green;
    font-weight: bold;
}

🎯 நினைவில் வைக்க: Class → . (பல elements-க்கு)

4. Group Selector

Group Selector (,)

பல selectors-க்கு ஒரே style பயன்படுத்த comma பயன்படுத்துவது.

h1, h2, p {
    color: blue;
}

ID vs Class

ID vs Class - வேறுபாடு

ID	Class
# பயன்படுத்தப்படும்	. பயன்படுத்தப்படும்
ஒரு element-க்கு மட்டும் (Unique)	பல elements-க்கு
Example: #header	Example: .box

3 Ways

Inline, Internal, External CSS

Type	CSS இருக்கும் இடம்	பயன்பாடு
Inline	HTML tag-க்குள்	Single element
Internal	<style> tag	Single webpage
External	.css file	Multiple webpages

1. Inline CSS

Inline CSS (Style Attribute)

HTML tag-ன் உள்ளே style attribute பயன்படுத்துவது.

<p style="color:red;">Hello World</p>

• Advantage: ஒரு element-க்கு உடனடியாக style கொடுக்க முடியும்
• Disadvantage: Code duplication, Maintenance கடினம்

2. Internal CSS

Internal CSS (<style> Tag)

HTML document-ன் <head> பகுதியில் <style> tag பயன்படுத்துவது.

<head>
<style>
p {
    color: blue;
    font-size: 20px;
}
</style>
</head>

3. External CSS

External CSS (.css File)

CSS code-ஐ தனியான .css file-ல் சேமித்து HTML document-க்கு link செய்வது.

HTML-ல்:

<link rel="stylesheet" href="style.css">

style.css-ல்:

body {
    background-color: lightblue;
}

h1 {
    color: red;
}

⭐ மிக முக்கியமான நன்மை: ஒரே CSS file-ஐ பல HTML pages பயன்படுத்த முடியும். Website maintenance மிகவும் எளிதாகிறது.

Background

A. Background Color & Image

/* Background Color */
body {
    background-color: lightblue;
}

/* Background Image */
body {
    background-image: url("background.jpg");
    background-repeat: no-repeat;
    background-size: cover;
}

Text

B. Text Formatting

p {
    color: red;
    text-align: center;
}

text-align values: left, right, center, justify

Fonts

C. Font Properties

p {
    font-family: Arial;
    font-size: 20px;
    font-weight: bold;
    font-style: italic;
    color: blue;
}

Links

D. Link States

a:link {
    color: blue;
}

a:visited {
    color: purple;
}

a:hover {
    color: red;  /* Mouse pointer link-ன் மேல் செல்லும்போது */
}

a:active {
    color: green;
}

⭐ மிக முக்கியமானது: hover = mouse pointer link-ன் மேல் செல்லும்போது நிறம் மாறும்

Lists

E. List Formatting

ul {
    list-style-type: square;
    /* values: disc, circle, square, none */
}

ol {
    list-style-type: upper-roman;
}

Tables

F. Table Formatting

table {
    width: 100%;
    border-collapse: collapse;
}

th {
    background-color: navy;
    color: white;
}

td {
    padding: 8px;
}

th, td {
    border: 1px solid black;
}

Full Example

முழுமையான Practical Example

<!DOCTYPE html>
<html>
<head>
<title>My Website</title>
<style>
body {
    background-color: lightblue;
    font-family: Arial;
}
h1 {
    color: darkblue;
    text-align: center;
}
p {
    color: black;
    font-size: 18px;
}
.important {
    color: red;
    font-weight: bold;
}
#special {
    background-color: yellow;
}
a:hover {
    color: red;
}
table {
    border-collapse: collapse;
}
th, td {
    border: 1px solid black;
    padding: 10px;
}
</style>
</head>
<body>
<h1>My School</h1>
<p>Welcome to my website.</p>
<p class="important">Important Notice</p>
<p id="special">Special Message</p>
<a href="#">Visit Us</a>
<table>
<tr><th>Name</th><th>Marks</th></tr>
<tr><td>Kamal</td><td>85</td></tr>
</table>
</body>
</html>

📝 முக்கிய Exam Q&A

Q1

What is CSS?

Answer: CSS stands for Cascading Style Sheets. It is used to control the appearance and formatting of HTML elements in web pages.

Q2

Write the basic syntax of CSS.

selector {
    property: value;
}

Q3

How do you write a comment in CSS?

/* This is a CSS comment */

Q4

Name four CSS selectors.

• Element selector
• ID selector
• Class selector
• Group selector

Q5-Q6

ID vs Class Selector Representation

ID: # symbol - #header { color: blue; }

Class: . symbol - .menu { color: red; }

Q7

Name three ways of inserting CSS.

• Inline CSS
• Internal CSS
• External CSS

Q8-Q9

Practical CSS Questions

Make all h1 red & centered:

h1 {
    color: red;
    text-align: center;
}

Change background to yellow:

body {
    background-color: yellow;
}

Q10

Advantage of external CSS?

Answer: External CSS allows the same style rules to be applied to multiple HTML pages. It also makes website maintenance and design changes easier.

10.6.1

Web Authoring Tool என்றால் என்ன?

Web pages-ஐ உருவாக்க, edit செய்ய மற்றும் manage செய்ய உதவும் software/application-கள் Web Authoring Tools எனப்படும்.

Examples:

• Adobe Dreamweaver
• Microsoft Expression Web
• Visual Studio Code
• KompoZer
• BlueGriffon

Uses

Web Authoring Tool-ன் பயன்பாடுகள்

• Web page உருவாக்கலாம்
• HTML code எழுதலாம்
• CSS சேர்க்கலாம்
• Images & Hyperlinks சேர்க்கலாம்
• Tables உருவாக்கலாம்
• Text formatting செய்யலாம்
• Web page preview பார்க்கலாம்
• Files save/manage செய்யலாம்

Steps

Webpage உருவாக்கும் Steps

• Step 1: Authoring tool-ஐ open செய்யவும்
• Step 2: New HTML document உருவாக்கவும்
• Step 3: Page title சேர்க்கவும்
• Step 4: Heading & paragraph சேர்க்கவும்
• Step 5: Images சேர்க்கவும்
• Step 6: Hyperlinks சேர்க்கவும்
• Step 7: CSS மூலம் appearance மாற்றவும்
• Step 8: Preview செய்யவும்
• Step 9: .html extension-ல் save செய்யவும்
• Step 10: Images/CSS files-ஐ சரியான folder-ல் வைக்கவும்

Exam Q&A

10.6 முக்கிய Exam Q&A

Q1. What is a Web Authoring Tool?

A: Software used to create, edit, format and manage web pages.

Q2. Give two examples.

A: Adobe Dreamweaver, Microsoft Expression Web

Q3. What can be created?

A: Web pages containing text, images, hyperlinks, tables and other web elements.

Q4. Purpose of previewing?

A: To see how the web page will appear in a web browser before publishing.

Q5. File extension for HTML?

A: .html (Example: index.html)

Q6. Purpose of HTML?

A: Define the structure and content of a web page.

Q7. Purpose of CSS?

A: Control the appearance and presentation of HTML elements.

Quick Notes

HTML vs CSS - வேறுபாடு

HTML	CSS
Structure	Appearance
Content	Design
Heading tag	Heading colour
Paragraph tag	Font size
Image tag	Image presentation
Link tag	Link appearance

Selectors

CSS Selectors Summary

Element → p, h1
ID      → #id
Class   → .class
Group   → h1, h2, p (comma)

Insertion

CSS Insertion Methods

Inline   → style attribute
Internal → <style> tag
External → .css file + <link>

Memory Trick

🔥 A/L Memory Trick

CSS = "Change Style Simply"

Selectors - E I C G:
Element | ID | Class | Group

Insertion - I I E:
Inline | Internal | External

HTML = Structure | CSS = Style | Authoring Tool = Create/Edit Web Pages

Must Write CSS

நீங்கள் கட்டாயம் எழுதத் தெரிந்திருக்க வேண்டிய CSS

/* CSS Example */

body {
    background-color: lightblue;
    font-family: Arial;
}

h1 {
    color: red;
    text-align: center;
}

p {
    font-size: 18px;
}

#special {
    color: green;
}

.important {
    font-weight: bold;
}

a:hover {
    color: red;
}

table {
    border-collapse: collapse;
}

th, td {
    border: 1px solid black;
    padding: 10px;
}

இந்த code-ஐ புரிந்துகொண்டு எழுதத் தெரிந்தால் 10.5-ல் வரும் theory + structured/practical CSS questions-க்கு நல்ல அடிப்படை கிடைக்கும்.

❓ அடிக்கடி கேட்கப்படும் கேள்விகள் (FAQ)

Q: CSS என்றால் என்ன? A: CSS என்பது Cascading Style Sheets ஆகும். இது HTML elements-ன் தோற்றம் (Appearance) மற்றும் வடிவமைப்பு (Formatting) ஆகியவற்றை கட்டுப்படுத்த பயன்படுத்தப்படும் விதிகளின் தொகுப்பாகும்.

Q: CSS-ன் அடிப்படை syntax என்ன? A: CSS-ன் அடிப்படை syntax: selector { property: value; } - எடுத்துக்காட்டு: p { color: red; font-size: 20px; }

Q: CSS Selectors-ன் வகைகள் யாவை? A: நான்கு முக்கிய CSS Selectors: 1. Element Selector (p, h1), 2. ID Selector (#header), 3. Class Selector (.menu), 4. Group Selector (h1, h2, p).

Q: HTML-ல் CSS சேர்க்கும் மூன்று வழிகள் யாவை? A: மூன்று வழிகள்: 1. Inline CSS (style attribute மூலம்), 2. Internal CSS (<style> tag மூலம் head-ல்), 3. External CSS (.css file-ஐ <link> மூலம் இணைத்தல்).

Q: Web Authoring Tool என்றால் என்ன? A: Web Authoring Tool என்பது web pages-ஐ உருவாக்க, edit செய்ய மற்றும் manage செய்ய உதவும் software ஆகும். எடுத்துக்காட்டுகள்: Adobe Dreamweaver, Microsoft Expression Web, Visual Studio Code, KompoZer.