HTML Styles

You can change the look of an HTML element with the style attribute. This is called inline CSS. The value is made of CSS property and value pairs.

<tagname style="property: value;">

---

Text colour and background

<h2 style="color: blue;">Blue heading</h2>
<p style="background-color: lightyellow;">Paragraph with a light yellow background.</p>

---

Font family and size

<p style="font-family: Verdana, sans-serif; font-size: 20px;">This text is in Verdana, 20 pixels.</p>

---

Text alignment

<p style="text-align: center;">Centered text</p>
<p style="text-align: right;">Right aligned text</p>

---

Border

<p style="border: 2px solid green; padding: 10px;">Paragraph with a green border.</p>

---

Several styles together

Separate the styles with a semicolon.

<p style="color: white; background-color: darkred; padding: 10px;">White text on dark red.</p>

---

Old styling tags are removed

In old HTML you might see tags and attributes like <font color="red">, <center> and bgcolor. They are not valid in HTML5. Use CSS instead.

---

Summary

• Use the style attribute with CSS properties to change the look.
• Separate several styles with semicolons.
• Do not use the old font and center tags.
• Next: HTML Formatting.

• Previous Page
• Next Page

---

Exercises & Assignments
No Content Found.

Interview Questions & Answers
No Content Found.