Inline Styles

Inline styles apply CSS directly to an HTML element via the style attribute. They override external and internal stylesheets.

Use them sparingly — only when styles must change dynamically via JavaScript.

Example

<p style="color: blue; font-weight: bold;">Bold blue text</p>
<div style="background: #fff3cd; padding: 12px; border-left: 4px solid #ffc107;">
  Warning box using inline styles
</div>

HTML

Full Editor

Pro Tip

Prefer CSS classes over inline styles — inline styles are hard to override and maintain.

Related Resources

HTML Reference

Complete tag & property list

HTML How-To Guides

Step-by-step practical guides

HTML Exercises

Practice what you've learned