VirtualMV/CSS/Example
From WikiEducator
Introduction
This page contains examples of two very different style sheets that can be attached to a web site.
|
Using styles in a web pageBy the end of this page you will be able to:
|
Sample css file linked to an html page
This is an example called neon.css (from Microsoft's Frontpage/Expression Web)
a:link { color: rgb(204,255,0); } a:visited { color: rgb(102,204,0); } a:active { color: rgb(255,255,0);} body {font-family: Verdana, Arial, Helvetica; background-color: rgb(0,0,0); color: rgb(102,255,51); } table {table-border-color-light: rgb(255,255,153); table-border-color-dark: rgb(255,255,51); } h1, h2, h3, h4, h5, h6 { font-family: Verdana, Arial, Helvetica; } h1 {color: rgb(204,255,0);} h2 {color: rgb(153,504,255);} h3 {color: rgb(255,51,153);} h4 {color: rgb(255,51,153);} h5 {color: rgb(153,504,255);} h6 {color: rgb(204,255,0);}
To include this in an html file
<html> <head> <title>HTML/CSS example</title> <link rel="stylesheet" type="text/css" href="neon.css" /> </head> <body> <h1>Heading one</h1> <p>If you are creating this html file<br /> try to create a page that tests out all of the styles in neon.css</p> </body> </html>
and an alternative sweets.css. As an exercise create this and change the href in the previous html example to see the change
a:link { color:#0033CC; } a:visited { color:#339966; } a:active { color:#FF9900; } body { font-family: Arial, Helvetica; background-color: rgb(255,255,204); color:#663399; } h1, h2, h3, h4, h5, h6 { font-family: Arial Rounded MT Bold, Arial, Helvetica; } h1 { color:#663399; } h2 { color:#FF6699; } h3 { color:#339966; } h4 { color:#663399; } h5 { color:#FF6699; } h6 { color:#339966; }
Notice I have changed the RGB decimal colours to hexidecimal
References
|
virtualMV | Superquick wiki guide | Please give me some feedback |
VirtualMV/CSS/Example. (2024). In WikiEducator/VirtualMV wiki. Retrieved November 5, 2024, from http:https://wikieducator.org/VirtualMV/CSS/Example (zotero)
|
