HTML and CSS Reference
In-Depth Information
When a CSS statement is provided as the value of an HTML element's style
attribute, only the property names and value expressions are used; the selector
expression and curly braces are omitted. he CSS statement just shown applied
to a particular level-two heading in a document would be written like this:
<h2 style="font-weight:bold; color:red;">...</h2>
CSS rules in the value of an HTML element's style attribute take prece-
dence over any rules previously in efect for that element's properties. In the
following HTML, the level-two heading will be bold, italic, and blue when
viewed in a typical browser:
<!DOCTYPE html>
<title>Example 3.0</title>
<style type="text/css">
h2 { font-style: italic; color: red; }
<h2 style="color:blue; font-weight: bold"> Earthquakes! </h2>
he normal order of the cascade can be overridden by adding an exclama-
tion point (!) and the important keyword ater a CSS rule. For example, chang-
ing the rule for the h2 element in the preceding code to this
h2 { font-style: italic; color: red !important; }
instructs the browser to ignore any further settings of h2 elements' color prop-
erty, unless those settings also include the important keyword. As a result, the
level-two heading will be bold italic and red.
he important keyword becomes very useful with content management sys-
tems and blogging sotware. It is oten common with such sotware for plugins
and other code to dynamically insert CSS style elements and attributes
directly into the document's head and body elements. If you only have access to
the style sheet, and your changes are blocked by the generated CSS rules ater
the style sheet is loaded, using !important can put you back in control.
Search WWH ::

Custom Search