HTML Styles with Examples

The style attribute of HTML is used to add some style to an elements,such as size,color,align and other properties of css.
Basically Style attribute's properties belongs to a CSS.

<html>

<body>

This is a normal paragraph

This is a style paragraph.

</body>

</html>

Output

Style attribute Syntax

<tagname style="property:value;">

Here, tagname is a element name i.e <a>,,<h1..h6> and etc.
style is a attribute which uses css properties in it.
property:value;, property hold the css properties such as, font-size,color,background-color, and more.. and "value" holds the value of that property such as, numberic or alphanumeric value.

<p style="color:red;font-size:20px;background-color:grey;">HELLO</p>

Output:
                HELLO 

Some common and basic style properties

:::::Background-color::::

To change the background color of any Html element we uses background-color property.

In background-color the value must be a color name or a hexadecimal color code.

<tagname style="background-color:red;"></tagname>

<tagname style="background-color:#FA8072;"></tagname>

:::::Text-color::::

Always remember that to change the text color we uses color property, not text-color property.
the value of color property are color name or hexadecimal color name.

<tagname style="color:green;"></tagname>

<tagname style="color:#53AH33;"></tagname>

:::::Font size & family::::

To change font size we uses font-size property where, the value of sizing must be numberic followed by px (pixel).

<tagname style="font-size:18px;"></tagname>

To change font style we uses font-family property.and its value must be a any font style for example- arial,algerian,sans-serif,monospace,impact and many more...

<tagname style="font-family:algerian;"></tagname>

::::Text-Align:::::

to move the position of text we uses text-align property, where the value must be center/left/right.

<tagname style="text-align:center;"></tagname>

You will learn all these property in detail in CSS.

HTML Styles with Examples - Code4xu