CSS Pocket Reference

CSS Pocket Reference

CHAPTER 1 Basic Concepts

Adding Styles to HTML and XHTML

Inline Styles

In HTML and XHTML, style information can be specified for
an individual element via the style attribute. The value of a
style attribute is a declaration block (see the section “Rule
Structure” on page 5) without the curly braces:

<p style="color: red; background: yellow;">Look out!
This text is alarmingly presented!</p>  

XML languages may or may not provide an equivalent capability;
always check the language DTD to be certain.

Embedded Style Sheets

A style sheet can be embedded at the top of an HTML or
XHTML document using the style element, which must appear
within the head element.XML languages may or may not provide an equivalent capability;
always check the language DTD to be certain.

External Style Sheets

Another key advantage is that external
style sheets are cached, which can help reduce bandwidth
usage. An external style sheet can be referenced in one
of the following three ways:

  • @import directive
    My Document

Note that @import directives can appear at the top (and, according
to the specification, only at the top) of any style sheet.
Thus, one style sheet could import another, which in turn
would import a third.

  • link element


    A Document
    media=“all”>
    media=“screen”>
    media=“print”>

It is also possible to link to alternate style sheets. If alternate
style sheets are supplied, it is up to the user agent (or the author)
to provide a means for the user to select one of the
alternates:

<head>
<title>A Document</title>
<link rel="stylesheet" type="text/css" href="basic.css">
<link rel="alternate stylesheet" title="Classic"
type="text/css" href="oldschool.css">
<link rel="alternate stylesheet" title="Futuristic"
type="text/css" href="3000ad.css">
</head>  

*xml-stylesheet processing instruction
In XML documents (such as XHTML documents sent with a
mime-type of “text/xml,” “application/xml,” or “application/
xhtml+xml”), an xml-stylesheet processing instruction can be
used to associate a style sheet with a document. Any xml-style
sheet processing instructions must be placed in the prolog of
an XML document. Multiple xml-stylesheet processing instructions
are permitted. The media pseudo-attribute can be
used to restrict a style sheet to one or more forms of media:
media=“all”?>
media=“screen”?>
media=“print”?>
It is also possible to link to alternate style sheets with the xmlstylesheet
processing instruction:

type=“text/css” href=“oldschool.css”?>
type=“text/css” href=“3000ad.css”?>

你可能感兴趣的:(CSS Pocket Reference)