Cascading Style Sheets CSS - External - Linking Style Sheets
CSS External - Linking Style Sheets
The linking CSS method involves creating a file that defines specific styles. This file should be saved as "mystyle.css" and will need to be uploaded to your server along with the pages that use it. The CSS file is a normal text file so you can use Notepad or anyother editor that produces text files, there are specilist CSS editors (such as TopStyle by Bradsoft) available and also some HTML editors have CSS editors built into them such as Dreamweaver.
Use caution when using CSS, as not all browsers equally support it and some older one not at all.
For you page(s) to abe able to use a style sheet, you must place a link to your style.css file within your HTML between the <head> and </head> tags so that the page know where to find your style sheet. You can link to your style sheet to as many of your pages you would like. This gives the the ability to update multiple pages in one go, just by changing the styles within your style.css file.
- <html>
<head>
<title>MyPage Title</title>
<link rel=stylesheet href="http://www.mydomain.co.uk/style.css" type="text/css">
</head>
<body>
Page Code and Content
</body>
</html>
Placing comments a CSS document
You can place comments is a style sheet - the comment starts with "/*" and ends with "*/"
e.g /* this is style sheet*/
Style Sheet Example mystyle.css
- body { font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 9pt;
font-style: normal;
line-height: 18pt;
font-weight: normal;
font-variant: normal;
letter-spacing: normal;
word-spacing: normal;
white-space: normal;
color: #000000;
background-image: none;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px; text-decoration: none;
background-color: White;
}
h1 { font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12pt;
font-style: normal;
line-height: normal;
font-weight: bold;
color: #FF0000
}
blockquote { font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 9pt;
font-style: normal;
line-height: 18pt;
font-weight: normal;
color: #000000
}
h2 { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10pt;
font-style: normal;
line-height: normal;
font-weight: bold;
color: #FF0000
}
h3 { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 9pt;
font-style: normal;
line-height: normal;
font-weight: bold;
color: #FF0000
}
h4 { font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 9pt;
font-style: normal; line-height: normal;
font-weight: bold;
color: #FF0000
}
div { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 9pt;
font-style: normal;
font-weight: normal;
font-variant: normal
}
etc...................................