Knightnet Site Design - Standard Style Sheet |
|||
|
This is the CSS (cascading style sheet) that I use for all of the pages on this web site. It allows the style of the site to be easily controlled and changed if required. /* +++ WARNING: Tag names are case sensitive, especially when using xhtml */
/* Standard Tags */
body {
background:#FFF;font-family:verdana,arial,helvetica,sans-serif;
margin:2px;text-align:justify;
/* Set IE browsers font size (see HTML>BODY below) */
font-size:78%;
}
/* Cheat to set mozilla browsers font size but not IE */
/* Sadly this sets the Opera default size too big */
/* This is the only hack I will allow in this CSS!!! */
/* html>body {font-size:78%;} */
/* Tidy up links */
/* NOTE: The order of these is important, always use order: link visited focus hover active
Also note that the head2 A tag is underlined for clarity (see below) */
a:link,a:visited,a:active {text-decoration:none;}
/* consider using a:focus here too */
a:hover,a:focus {text-decoration:underline;}
/* Make all table rows allign to top rather than middle */
tr {vertical-align:top;}
/* Set Firebirds font size correctly */
input,textarea {font-family:verdana,arial,helvetica,sans-serif;font-size:100%;}
/* Prevent line round linked images */
a img {border:0;}
/* Reduce size of top/bottom margins on default paras and text on headings */
p {margin-top:.8em;margin-bottom:.8em;font-size:1em;line-height:1.3em;}
form {margin-top:0.2em;margin-bottom:0.2em;}
/* Lists */
ul {margin-top:0.8em;margin-bottom:0.5em;}
li {margin-top:0.1em;margin-bottom:0.2em;}
ul LI:first-line {font-style:italic;text-align:left;}
dt {font-weight:bold;}
dd {margin-left:0;padding-left:0;margin-bottom:0.6em;}
/* Also adjust heading font sizes */
h1,h2,h3,h4,h5 {text-align:left;}
h1 {font-size:165%;}
h2 {font-size:135%;border-bottom:1px solid silver;}
h3 {font-size:120%;margin-top:0.1em;margin-bottom:0.3em;}
h5 {font-size:110%;margin-top:0.1em;margin-bottom:0.1em;}
/* Make h.lines neater weird cause of browser problems */
hr {height:0px;border:0;border-top:1px solid silver;}
/* Better layout for embeded code blocks */
code {display:block;background:#EEE;font-family:monospace;font-size:93%;
white-space:pre;border:1px solid silver;padding:0.5em 1em 0.5em 1em}
.code { /* Ooops, I used to use this class but that is wrong */
background:#D0D0D0;font-family:monospace;white-space:pre;border:solid thin;}
.codeSpan {/* for examples of code embeded in a line */
background:#EEE;font-family:monospace;}
/* -- Classes for the standard site template -- */
/* layout table */
body table {width:100%;border-collapse:collapse;border:0;padding:0;}
/* Left top heading (Head1) */
.tblHead1 {/*TD*/
background:#369;color:#FF6;text-align:center;
padding:.2em;font-size:85%;border-bottom:1px solid #FFF;}
.tblHead1Bu {text-align:center;font-size:85%;} /*SUBMIT*/
/* Right top heading (Head2) */
.tblHead2 {/*TD*/
background:#369;color:#FF6;padding:.5em;
border-left:1px solid #FFF;border-bottom:1px solid #FFF;}
.tblHead2 h1 {margin-top:0;margin-bottom:0.3em;} /*H1 (page title)*/
/* Main Left (nav menu holder) */
.tblLeft1 {/* 1st row*/
background:#369;color:#FF6;vertical-align:top;padding:0;margin:0;border:0;}
.tblLeft {/* | 2nd row*/
background:#369;color:#FF6;vertical-align:top;padding:0 0.5em 0 0.5em;}
/* Main content section (spans 2 rows)*/
.tblMain {vertical-align:top;padding:.5em 1% .5em 1.5%;} /*TD*/
.tblMain a {font-weight:bold;} /*links*/
/* Left Footer */
.tblFoot1 {background:#369;color:#FF6;font-size:75%;border-top:1px solid #FFF;} /*TD*/
.tblFoot1 a {color:#FF6;}
/* Right Footer */
.tblFoot2 {font-size:75%;border-left:1px solid #FFF;border-top:1px solid #FFF;} /*TD*/
/* db content */
.gotoTop {float:right;font-size:75%;} /* link to top */
.edClnk { /* edit content link in h2 titles */
float:right;font-size:50%;font-weight:normal;margin-top:0.5em;}
/* -- Classes for breadcrumb trail -- */
.bcrumb a {font-weight:bold;color:#FF6;font-variant:small-caps;border-bottom:1px solid #CC3;}
.bcrumb a:hover,a:focus {text-decoration:none;}
.bcrumb span {/*Current Page*/
font-weight:bold;font-style:italic;font-variant:small-caps;color:#EED;}
.bcrumbSite {text-align:right;}
/* -- Classes for the Automenu -- */
.automenu {white-space:nowrap;} /* | | |
![]() ![]() |
Page: Updated 2008-07-10 08:50:07, Author Julian Knight |