HTML Attributes

Every HTML element can have attributes.
The HTML Attribute provide additional information about an element.
The Attributes are always Used in the start tag.
The Attributes use name/value pairs like:
name=”value”

The HTML Style Attribute

You set additional style property by Using Style attribute.

The style attribute give styling in HTML elements.
The background-color attribute is use for background color.

Example of HTML style Attribute

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h2 style="background-color: green;">This is a Heading</h2>
<h3 style="background-color: red;">This is a Heading</h3>
<p style="background-color: yellowgreen;">This is a paragraph.</p>

</body>
</html>

Output

Page Title

This is a Heading

This is a paragraph.

Color Attribute

The color attribute is used for text colors.

Example of HTML color attribute

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h2 style="color: red;">This is a Heading</h2>
<h3 style="color: blue;">This is a Heading</h3>
<p style="color: green;">This is a paragraph.</p>

</body>
</html>

Output

Page Title

This is a Heading

This is a paragraph.

Font-Family

The font-family attribute is used for text fonts.

Example of HTML Font-Family Attribute

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h2 style="font-family: algerian;">This is a Heading</h2>
<h3 style="font-family: verdana;">This is a Heading</h3>
<p style="font-family: sans-serif;">This is a paragraph.</p>

</body>
</html>

Output

Page Title

This is a Heading

This is a paragraph.

Font-Size

The font-size attribute is used for text sizes.

Example of HTML Font-Size Attribute

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h2 style="font-size: 25px;">This is a Heading</h2>
<h3 style="font-size: 20px;">This is a Heading</h3>
<p style="font-size: 15px;">This is a paragraph.</p>

</body>
</html>

Output

Page Title

This is a Heading

This is a paragraph.

Text-Align

The text-align attribute is used for text alignment.

Example of HTML Text-Align Attribute

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h2 style="text-align: left;">This is a Heading.</h2>
<h3 style="text-align: center;">This is a Heading.</h3>
<h4 style="text-align: right;">This is a Heading.</h4>


</body>
</html>