HTML and CSS Reference
In-Depth Information
Attaching a style sheet
Before using CSS with HTML, you need to attach a style sheet to the page so that the
CSS styles can access the HTML they are associated with. There are a couple ways of
doing this, but the way you should approach it by using the
link
element.
link
first
may recall, this element appears in the
head
section of the page, and the
rel
attribute
is used to indicate the linked document is a style sheet:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>HTML5 and CSS together</title>
<link
rel="stylesheet"
href="css/
main.css" type="text/css" />
</head>
<body>
<p>CSS rules!</p>
</body>
</html>
sheet, as that is what the linked document will be presumed to be by default.
The
title
attribute has special significance to the
link
element within the context
of style sheets. This attribute is used for differentiating the different possible kinds of
style sheets that are linked. You may be asking yourself, “What different kinds of style
sheets?” Don't worry, it's all CSS; there isn't another language to learn! The kinds of
style sheets determine the priority a particular style sheet has over other style sheets
linked on the page. There are three kinds that can be added to a document:
•
Persistent
: Always applied to the document
•
Preferred
: Applied to the document unless an alternative style sheet is applied
•
Alternative
: Alternative to the preferred or persistent style sheet
The main implementation difference between persistent, preferred, and alternative
style sheets is that persistent style sheets
do not
have a
title
attribute, while preferred
and alternative style sheets
do
.
All style sheets that are persistent will be applied to the HTML document, regardless
of the number that are attached. This is the most common way that style sheets are ap-
Search WWH ::
Custom Search