|
Step 7 - Learn CSS.
CSS is an easy and quick way to change the style stuff on a layout because all your style info you need to change (eg. fonts, colours scrollbars etc.) is on one page. Here is the stuff you need on that page;
Change the stuff thats in capitals. Click here for the colours. But before you do I'll go through what it all means, The first 4 lines are to change your links, its really up to you but most people would have all the colours there the same but just change the colour on the last line this would mean that when you hover over your links they change colour. You could also add effects for when you hover over like adding a border, to do this just add border:NUMBERpt solid COLOUR; before } on the last line. You can chnage solid to dashed or dotted to get a different line, if you only wanted a border on the bottom use border-bottom:NUMBERpt solid COLOUR; instead. The fifth line is to change your bold text you could add a border or bottom border like you can for the links and you use it for italic and underlined text by changing the b at the beginning to a u for underlined or an i for italic. The next section is about the normal text. If you want the background to be an image instead of just a colour replace background-color:COLOR; with background-image:url("IMAGEURL"); and change IMAGEURL with the url or your image. The rest of that bit is easy just change the capitals. The next bit is to change the colours of your scrollbar. heres what all that means, If you change the COLOUR in scrollbar-face-color: COLOUR; it will change the bit highlited in red in this picture; ![]() If you change the COLOUR in scrollbar-arrow-color: COLOUR; it will change the bit highlited in red in this picture; ![]() If you change the COLOUR in scrollbar-track-color: COLOUR; it will change the bit highlited in red in this picture; ![]() If you change the COLOUR in scrollbar-3dlight-color: COLOUR; it will change the bit highlited in red in this picture; ![]() If you change the COLOUR in scrollbar-highlight-color: COLOUR; it will change the bit highlited in red in this picture; ![]() If you change the COLOUR in scrollbar-shadow-color: COLOUR; it will change the bit highlited in red in this picture; ![]() If you change the COLOUR in scrollbar-darkshadow-color: COLOUR; it will change the bit highlited in red in this picture; ![]() The next bit (which starts with td in case your lost) is to decorate your tables, you can change the border bit the way a showed you before. letter-spacing:0px; is to change how far apart the letters will be, 0 is normal but if you want the letters to overlap a bit change it to -1. font-weight:normal; sounds weird but it just changes the thickness of the text: change normal to bold and you will have bold text, its as easy as that and the rest you should understand by now. And the last part is for input feilds for in forms (step 10) and textareas which you'll in the next step so you might want to wait untill you find out what they are to fill in that bit, it should be really easy by now to do that. Remember to put this; |
|









