HTML Styles

Styles

Background-color

  • ┬ádefines the background color for an HTML element.
Program on Background Color
<!DOCTYPE html>
<html>
<head>
</head>
<body style=”background-color:lightblue;”> <h1>Background Color</h1>
</body>
</html>
Output

Background Color

Text-color

  • defines the text color for an HTML element.
Program on Text Color
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h1 style=”color:red;”>Text Color RED</>
<h2 style=”color:blue;”> Text Color BLUE.</h2>
</body>
</html>
Output

Text Color RED

Text Color BLUE.

Font-Family

  • defines the font to be used for an HTML element.
Program on Font-Family
<!DOCTYPE html>
<html>
<head>
</head>
<body>

<h1 style=”font-family:vrinda;”>Font Family-1</h1>

<h2 style=”font-family: Calibri;”>Font Family-2</h2>
</body>
</html>

Output

Font Family-1

Font Family-2

Font Size

  • defines the text size for an HTML element.
Program on Font-size
<!DOCTYPE html>
<html>
<head>
</head>
<body>

<h1 style=”font-size:100%;”>Font Size 1</h1>

<h2 style=”font-size:250%;”>Font Size 2</h2>

</body>
</html>

Output

Font Size 1

Font Size 2

Text Alignment

  • defines the horizontal text alignment for an HTML element.
Program on Text Alignment
<!DOCTYPE html>
<html>
<head>
</head>
<body>

<h1 style=”text-align:left;”>Aligned to Left side</h1>

<h2 style=”text-align:center;”>Aligned at Center</h2>

</body>
</html>

Output

Aligned to Left side

Aligned at Center

 

Leave a Reply

Your email address will not be published. Required fields are marked *