HTML Styles
HTML style is an attribute that is used to add some cosmatic effect to the elements, such as color, background color, font size, and many more.
Examples
<!DOCTYPE html>
<html>
<body>
<p>This is without style</p>
<p style="color:red;">This is red color text</p>
<p style="background-color:blue;">This is blue background</p>
<p style="font-size:50px;">This is big font-size.</p>
</body>
</html>
Output:
HTML Style Syntax:
The HTML style
attribute has the following syntax:
<tagname style="property:value;">
Where the property is a CSS property. The value is a CSS value.
Background Color:
The CSS background-color
property defines the background color for an HTML element.
<!DOCTYPE html>
<html>
<body style="background-color:yellow;">
<p>This is yellow page</p>
</body>
</html>
Output:
Fonts:
There are many Font properties like font-size, font-family, font-weight etc.
- font-size : Used to increase size of text.
- font-family : Used to provide text style.
- font-weight : Used to provide thikness of text.
Example:
<!DOCTYPE html>
<html>
<body>
<p style="font-size:30px;">This is of example of font size</p>
<p style="font-weight:bold;">This is of example of font weight</p>
<p style="font-family:courier;">This is of example of font family</p>
</body>
</html>
Output:
Multiple Style properties:
There can be multiple style properties for single tag.
Example:
<!DOCTYPE html>
<html>
<body>
<p style="font-size:30px; font-weight:bold;color: red;">This is of example of multiple style properties</p>
</body>
</html>
Output: