Inline CSS

Styling your Web page is one of the main concept while creating a webpage. With the help of CSS we can style our HTML file in three ways they are External CSS, Internal CSS and Inline CSS. In this Blog we will learn about inline styling. Inline-CSS in HTML is one of the ways of adding styles to our HTML page.

It not recommended to use inline-css, But, it is important to know about it .With the help of the Style attribute we can add inline CSS to our HTML file. By using inline style we can style  single element with the insert style sheets in an HTML document.

Syntax:

<tag style = " "></tag>

Example 1:

<!DOCTYPE html>
<html>

<body>
    <h1 style="color: #FFC300; font-size: 50px; text-align: center; background-color:black;">
        Fullstackadda.com
    </h1>
</body>

</html>

Output:

Example 2:

<!DOCTYPE html>
<html>

<body>
    <h1 style="color: black; background: yellow">
        Fullstackadd.com
    </h1>
    <p style="color: white; background: black;">
        Code Well -----.
    </p>
</body>

</html>

Output:

inline css
  1. Inline CSS in HTML is one of the ways of adding styles to our HTML page.
  2. It not good practice to use inline css because It’s difficult to keep up, reuse, and scale.