HTML Styles

The HTML style attribute is used to add styles to an element, such as color, font, size, and more.

<tagname style="property:value;">

<body style="background-color:powderblue;">
    <h1>This is a heading</h1>
    <p>This is a paragraph.</p>
    
    <!-- Set background color -->
    <h1 style="background-color:powderblue;">This is a heading</h1>
    <p style="background-color:tomato;">This is a paragraph.</p>
    
    <!-- Text Color -->
    <h1 style="color:blue;">This is a heading</h1>
    <p style="color:red;">This is a paragraph.</p>
    
    <!-- Fonts -->
    <h1 style="font-family:verdana;">This is a heading</h1>
    <p style="font-family:courier;">This is a paragraph.</p>
    
    <!-- Text Size -->
    <h1 style="font-size:300%;">This is a heading</h1>
    <p style="font-size:160%;">This is a paragraph.</p>
    
    <!-- Text Alignment -->
    <h1 style="text-align:center;">Centered Heading</h1>
    <p style="text-align:center;">Centered paragraph.</p>
</body>

Summary

  • Use the style attribute for styling HTML elements

  • Use background-color for background color

  • Use color for text colors

  • Use font-family for text fonts

  • Use font-size for text sizes

  • Use text-align for text alignment

PreviousHTML AttributesNextHTML Formatting Elements

Last updated