HTML Styles
The style attribute lets you change how a single element looks, right from its start tag.
You style an element by writing CSS property and value pairs inside the style attribute, separated by semicolons. This is called inline styling.
The style Attribute
Inline style
<!DOCTYPE html>
<html>
<body>
<p style="color:blue; font-size:18px;">A blue paragraph.</p>
</body>
</html>Common Properties
Background Color
Coloring a whole element
<!DOCTYPE html>
<html>
<body>
<div style="background-color:#9ce56d;">A green box</div>
</body>
</html>Text Alignment
Centering text
<!DOCTYPE html>
<html>
<body>
<h1 style="text-align:center;">Centered heading</h1>
</body>
</html>Note: Inline styles are handy for a quick change, but once a page grows a separate stylesheet keeps things tidy and reusable.
Exercise: HTML Styles
How do you apply an inline style directly to a single HTML element?
