HTML Style Tag
<style> tag, ஒரு HTML document-ன் style information-ஐ வரையறுக்க பயன்படுத்தப்படுகிறது.
HTML document-ன் style ஆனது 3 விதமாக apply செய்யப்படுகிறது.
- Inline css
- Internal css
- External css
Inline CSS
ஒரு HTML tag-ற்க்குள் style என்ற attribute-ஐ பயன்படுத்தி styles-ஐ apply செய்தால் அது inline css.
Example
Example
Try this code<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<p style="background-color:orange;color:black;">Everything that is real was imagined first!..</p>
<p style="background-color:blue;color:white;font-size:15px;">Everything that is real was imagined first!..</p>
<p style="background-color:crimson;color:white;font-size:18px;padding:10px;">Everything that is real was imagined first!..</p>
</body>
</html>
Output
Everything that is real was imagined first!..
Everything that is real was imagined first!..
Everything that is real was imagined first!..
Internal CSS
<style> </style> tag-ற்க்குள், class அல்லது id attribute-ஐ பயன்படுத்தி head section அல்லது body section-க்குள் HTML document-க்கான styles-ஐ apply செய்தால் அது Internal css.
Example
Example
Try this code<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<p class="cgstyle1">Everything that is real was imagined first!..</p>
<p class="cgstyle2">Everything that is real was imagined first!..</p>
<p id="cgstyle3">Everything that is real was imagined first!..</p>
<style>
.cgstyle1{
background-color:orange;
color:black;
}
.cgstyle2{
background-color:blue;
color:white;
font-size:15px;
}
#cgstyle3{
background-color:crimson;
color:white;
font-size:18px;
padding:10px;
}
</style>
</body>
</html>
இது பற்றிய தங்களின் கருத்துகளை இங்கே பதிவிடுங்கள் . இது பயனுள்ளதாக விரும்பினால் மற்றவர்களுக்கும் இதை share செய்யுங்கள்.
Comments