HTML being a markup language provides an attribute to hold style information. The CSS style attribute module provides the syntax of how CSS fragments should be used in style attributes.
The style attribute allows the web developer to apply style information to specific elements.
Here is an example of a style attribute:
<input style=”color: #099”> …
To support CSS to be used to define style for an element, the value of the style attribute must match the content of a CSS declaration block.
CSS declaration block
A CSS declaration block’s syntax is as under:
declaration-list
: S* declaration? [ ‘;’ S* declaration? ]*
;
This means that any style definition that adheres to this can be used to define a style of an element using CSS3.
Examples of CSS style attribute:
<!DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01//EN” “http://www.w3.org/TR/html4/strict.dtd”>
<html>
<head>
<style type=”text/css”>
div { color: white ! important; background: green ! important; }
</style>
</head>
<body>
<div style=”color: yellow; background: red;”> This should be white on green. </div>
</body>
</html>
Here is another example:
<!DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01//EN” “http://www.w3.org/TR/html4/strict.dtd”>
<html>
<head>
<style type=”text/css”>
div { color: green ! important; }
</style>
</head>
<body>
<div style=”color: red”> This should be green. It has a style
attribute with “color: red” but an important rule with “color:
green”. </div>
</body>
</html>
In the above examples, we can see how style information defined in CSS can be used to apply to elements.
Summary
In this article, we learned how style information defined in CSS can be used to apply to elements.
About the author
Vipul Patel is a technology geek based in Seattle. He can be reached at vipul.patel@hotmail.com . You can visit his LinkedIn profile at https://www.linkedin.com/pub/vipul-patel/6/675/508
References
http://www.w3.org/TR/css-style-attr/
The original home of HTML tutorials. HTMLGoodies is a website dedicated to publishing tutorials that cover every aspect of being a web developer. We cover programming and web development tutorials on languages and technologies such as HTML, JavaScript, and CSS. In addition, our articles cover web frameworks like Angular and React.JS, as well as popular Content Management Systems (CMS) that include WordPress, Drupal, and Joomla. Website development platforms like Shopify, Squarespace, and Wix are also featured. Topics related to solid web design and Internet Marketing also find a home on HTMLGoodies, as we discuss UX/UI Design, Search Engine Optimization (SEO), and web dev best practices.
Property of TechnologyAdvice. © 2025 TechnologyAdvice. All Rights Reserved
Advertiser Disclosure: Some of the products that appear on this site are from companies from which TechnologyAdvice receives compensation. This compensation may impact how and where products appear on this site including, for example, the order in which they appear. TechnologyAdvice does not include all companies or all types of products available in the marketplace.
