HTML style
The style attribute specifies how an element will render in a web browser, e.g., the color or size of a font in a paragraph.
When the style attribute is used inline, it overrides any styles set globally.
Note: The styling of a page or elements on the page can also be embedded in the
<head>element using the<style>tag. However, it is more common to style elements through an external CSS style sheet, which helps keep the code clean and more easily maintained. The syntax for using an external style sheet can be seen in the<link>entry.
Syntax
<element_tag style="property1:value; property2:value;"></element_tag>
Like all global attributes, the style attribute supports all HTML tags and can take many properties, e.g., the style attribute can be used in the <p>, <h1>, or <hr> tags.
Example
In the example below, the <p> element is given a style attribute to specify its color, text alignment, and font size:
<p style="color:green; font-size:20px; text-align:center;">Here's some text that is being styled using the style attribute.</p>
The example above results in the following output:
Contribute to Docs
- Learn more about how to get involved.
- Edit this page on GitHub to fix an error or make an improvement.
- Submit feedback to let us know how we can improve Docs.
Learn HTML on Codecademy
- Front-end engineers work closely with designers to make websites beautiful, functional, and fast.
- Includes 34 Courses
- With Professional Certification
- Beginner Friendly.115 hours
- Start at the beginning by learning HTML basics — an important foundation for building and editing web pages.
- Beginner Friendly.7 hours