HTML and CSS Reference
In-Depth Information
With one <link> tag, the browser should load the styles in the referenced
stylesheet and format the document accordingly, with any document-
level and inline styles overriding the external definitions. With two or
more <link> tags, the browser should present the user with a list of all
the linked stylesheets. The user then selects one of the linked sheets,
which the browser loads and uses to format the document; the other
linked stylesheets get ignored.
On the other hand, the styles-conscious browser merges, as opposed to
separating, multiple @import ed stylesheets to form a single set of style
rules for your document. The last imported stylesheet takes precedence
if there are duplicate definitions among the stylesheets. Hence, if the
external gen_styles.css stylesheet specification first tells the browser to
make <h1> contents blue and italic, and then a later spec_styles.css tells
the browser to make <h1> text red, the <h1> tag contents appear red and
italic. And if we later define another colorsay, yellowfor <h1> tags in a
document-level style definition, the <h1> tags are all yellow and italic.
Cascading effects. See?
In practice, the popular browsers treat linked stylesheets just like im-
ported ones by cascading their effects. The browsers do not currently let
you choose from among linked choices. Imported styles override linked
external styles, just as the document-level and inline styles override ex-
ternal style definitions. To bring this all together, consider this example:
<link rel=stylesheet href=sheet1.css type=text/css>
<link rel=stylesheet href=sheet2.css type=text/css>
@import url(sheet3.css);
@import url(sheet4.css);
Search WWH ::

Custom Search