HTML and CSS Reference
In-Depth Information
28.
footer, header, hgroup, menu, nav, section {
29.
display: block;
30.
}
31.
body {
32.
line-height: 1;
33.
}
34.
ol, ul {
35.
list-style: none;
36.
}
37.
blockquote, q {
38.
quotes: none;
39.
}
40.
blockquote:before, blockquote:after,
41.
q:before, q:after {
42.
content: '';
43.
content: none;
44.
}
45.
table {
46.
border-collapse: collapse;
47.
border-spacing: 0;
48.
}
4.
With our
main.css
file starting to take shape, let's connect it to our
in-
dex.html
file. Opening the
index.html
file in our text editor, let's add the
<link>
element within our
<head>
element, just after the
<title>
element.
5.
Because we'll be referencing a style sheet within the
<link>
element, let's add
the relation attribute,
rel
, with a value of
stylesheet
.
6.
We also want to include a hyperlink reference, using the
href
attribute, to our
main.css
file. Remember, our
main.css
file is saved within the “stylesheets”
folder, which is inside the “assets” folder. Therefore, the
href
attribute value,
which is the path to our
main.css
file, needs to be
assets/stylesheets/
main.css
.
1.
<head>
2.
<meta charset="utf-8">
3.
<title>Styles Conference</title>
4.
<link rel="stylesheet" href="assets/stylesheets/main.css">
5.
</head>
Time to check out our work and see if our HTML and CSS are getting along. Now opening
our index.html file (or refreshing the page if it's already opened) within a web browser
should show slightly different results than before. Currently our website should look like
Search WWH ::
Custom Search