# Linking to an External Style Sheet
--------------------------------------------------
put the following code in <head></head>
<link rel="stylesheet" type="text/css" href="mystyle.css" />
# Embedding a Style Sheet
---------------------------------------------
<STYLE TYPE="text/css" MEDIA=screen>
<!--
BODY { background: url(foo.gif) red; color: black }
P EM { background: yellow; color: black }
.note { margin-left: 5em; margin-right: 5em }
-->
</STYLE>
The STYLE element is placed in the document HEAD. The required TYPE attribute is used to specify a media type, as is its function with the LINK element. Similarly, the TITLE and MEDIA attributes may also be specified with STYLE.
# Importing a Style Sheet
---------------------------------------------------
A style sheet may be imported with CSS's @import statement. This statement may be used in a CSS file or inside the STYLE element:
<STYLE TYPE="text/css" MEDIA="screen, projection">
<!--
@import url(http://www.itechies.net/style.css);
@import url(/stylesheets/punk.css);
DT { background: yellow; color: black }
-->
</STYLE>
Note that other CSS rules may still be included in the STYLE element, but that all @import statements must occur at the start of the style sheet. Any rules specified in the style sheet itself override conflicting rules in the imported style sheets.
# Inlining Style
-----------------------------------------
Style may be inlined using the STYLE attribute.
<P STYLE="color: red; font-family: 'New Century Schoolbook', serif"> This paragraph is styled in red with the New Century Schoolbook font, if available.</P>
To use inline style, one must declare a single style sheet language for the entire document using the Content-Style-Type HTTP header extension. With inlined CSS, an author must send text/css as the Content-Style-Type HTTP header or include the following tag in the HEAD:
<META HTTP-EQUIV="Content-Style-Type" CONTENT="text/css">
Search code samples
Code Samples
LOGIN HERE