/* Make sure you've got a page with well-formed standards based HTML 4.01, link it to this style sheet and you should see the result straight away. */ /* The element is just that, an element. So there's no reason why you can't give it its own style then make it appear around the using a margin - that's all we do here. You might even like to add your own background image properties to this element to get an even more dynamic effect. */ html {background-color: #93451e;} body { border: none; background-color: #330000; font-family: Verdana, Helvetica, Arial, sans-serif; font-size: 0.8em; background-image: url(background2.png);; background-repeat: repeat} /* The following gives a special effect for

elements which works best if there is only one of them on at the top of each page - so they are a sort of title. / h1 {background-color: #a95728; color: #e7dfd4; font-size: 2em; border-bottom: 1px #5c2717 solid;} h2 {background-color: #a76624; color: #e7dfd4; border-top: 1px #5c2717 solid; border-bottom: 2px #5c2717 solid; padding-right: 3%; padding-left: 3%; padding-top: .5%; padding-bottom: .5%; font-weight: bold; font-size: 1.6em; margin: 0px;} h3 {padding-right: 3%; padding-left: 3%; border-bottom: 2px #5c2717 solid; font-size: 1.3em; font-style: italic; font-weight: bold; color: #5c2717;} h4 {color: #5c2717; padding-right: 3%; padding-left: 18%; font-weight: bold; text-decoration: underline; font-size: 1.1em; font-style: italic;} / The following four selectors allow you to select links when they are in the four different states: link - before they have been visited, visited - after it has been visited, hover - when the mouse is over the link, active - when the user clicks the link. / a:link {text-decoration: none; color: #CC9933;; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px} a:visited {text-decoration: none; color: #BD8633;; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px} a:hover {background-color: #a76624;; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; text-decoration: underline} a:active {; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px} p {;} blockquote {background-color: #5c2717; color: white; font-style: normal; font-weight: bold;} / This section of the style sheet has just a few selectors and properties to help you find your way around adding style to regular, standards-based HTML 4.01 tables (ie, a table to be used for presenting tabular information). / / The following selector selects the table as a whole and gives it a background color and a border. The last couple of properties might be unfamiliar to you. border-collapse allows you to specify that adjacent borders should collapse onto one another. border-spacing allows you to specify a gap between the borders of cells in a table, or in this case that there should be no gap. You'll find these properties in Style Master on the Display Type Editor. / table {border: none; display: table; border-collapse: collapse; border-spacing: 0px; background-color: #330000;; clip: rect( ); font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; color: #CC9933} / Using the element for cells in the top row of an HTML table means that it is easy to apply a different style to this row and make it stand out from the rest of the table. */ th { background-color: #330000; color: white;} th {;} td { ; }