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 .
Click here to view code image
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
Figure 1.6 .
Search WWH ::




Custom Search