Learn CSS  Tutorials-Templates

• Home
• Return to build a Web Site
• To (X)HTML Tutorials
• To Website Design
• To Web Information

So you have style?    make sure by getting the right help

• This page follows the same pattern as HTML page.
• We will look at simple CSS pages and try to visualise how the code will affect the HTML output.
• Each menu item in the CSS Tutorial/ Temp side menu will give you a different slant on the subject.
• As in the "How to Start" page, you see how simple coding is constructed enabling you to apply it to a HTML page
• CSS Templates can be down loaded off most sites, many with their own HTML designed markup page.
• When viewing "CSS Templates" many of the authors take you through each section as if it was a tutorial.
• You will find a lot of duplication of HTML and CSS subject matter. Just pick the site you like best.

" CSS is the way we apply style to HTML content and keep the style consistent throughout"

This is an example of CSS applying style to 2 HTML elements used at the head of the page:
Firstly to the overall body of the document and then inserting an image, then styling the h1 element to produce a heading positioned on the image

body {  
                background: #1d1006  url(bgtop.gif)  top repeat-x;
                text-align:center;
}

#header{
                width:100%;
                background:url(header.gif) top left  no-repeat;
                height:120px;
}

h1{
                margin:0;
                font-weight:normal;
                letter-spacing:-2px;
                font-family:"Times New Roman", Times, serif;
                font-size:3.2em;
}

span {
        Color: #b3da8b;
}
                

                Can you guess what you are looking at?
 Well look at the top of the screen and you will see that the 
 background (bgtop.gif) has been overwritten my an image (header.gif),
 and the heading h1 has been split into 2 colours by the use of the
 element "span"
                

Well I hope that when you have followed and practiced what you learnt in the tutorial of your choice, you will have a better understanding of CSS layout.
Thanks again to the various sites that have helped; they are all in the side menu to peruse.