Inline Style

Style is directly written into HTML element (ex., <html>, <p>, <div>).

Pros:

System gives first preference to inline styles.

Cons:

Styles needs to directly written into each and every element level.

Note: In general, developers community avoid to use more inline styles because of the maintenance, reusability and scalability issues.

Example:


                        <h1 style="text-align:center;">CSS Styles</h1>

Example: Apply CSS inline style to some HTML elements.

                        
<!DOCTYPE html />
<html>
<head>
   <title> CSS Inline Style </title>
</head>
<body  style="width:800px;border:dotted;" >
    <h1 style="text-align:center;">CSS Styles</h1>
    <h2 style="background-color:green;color:white;">Different ways to apply CSS styles</h2>
    <p style="font-family:arial;"> 1)	Inline style </p>
    <p style="font-family:arial;"> 2)	Internal style sheet</p>
    <p style="font-family:arial;"> 3)	External style sheet </p>
</body>
</html>

Result:

In the above example,

CSS inline styles are applied to HTML elements.
STYLE attribute is used to set inline styles to HTML elements.