CSS in Freewebs

Main >> Tutorials >> Freewebs >> CSS in Freewebs

Using CSS in Freewebs is a little different from Piczo. You actually just have to paste in the CSS code one time and when you change this code you will change the whole site. Here's how it works:

Step 1: Copy a CSS code like this the one under, without the style-tags. Paste the code in a new page you call CSS (or something else, it is up to you).
body, div, p { font-family: Tahoma; font-size: 7pt; line-height: 7pt; color: #000000; margin: 0; padding: 0; background-color: #404040; scrollbar-face-color:#808080; scrollbar-highlight-color:#808080; scrollbar-3dlight-color:#808080; scrollbar-shadow-color:#808080; scrollbar-darkshadow-color:#808080; scrollbar-track-color:#808080; scrollbar-arrow-color:#fff; } .entrytext{ font-weight: normal; } li { list-style-image:url(http://img148.imageshack.us/img148/2390/iiqp1.gif); margin-bottom: 0px; margin-top: 0px; margin-right: 2px; margin-left: 0px; } u { color: #ffffff; font-family: arial; font-size: 7pt; font-weight: bold; text-align: justify; border-bottom: 1px dotted #ffffff; } b { COLOR: #000000; font-family: arial;FONT-SIZE: 7pt; background: #ffffff } h1 { cursor:default; background-color: #bafdb0; color: #000000; font-size:7pt; font-family:verdana; letter-spacing:1px; line-height:13pt; text-align: right; padding: 1px; font-weight: bold; text-transform: uppercase; border-bottom: 3px solid #ffffff; margin-bottom: 0px; margin-top: 0px; margin-right: 0px; margin-left: 0px; } h2 { cursor:default; background-color: #000000; font-size:6pt; font-family:small fonts; letter-spacing:1px; line-height:7pt; color: #ffffff; padding: 0px; font-weight: normal; text-transform: uppercase; margin-bottom: 0px; margin-top: 0px; margin-right: 0px; margin-left: 0px; } h3 { cursor:default; background-color: #404040; font-size:7pt; font-family:arial; letter-spacing:0px; line-height:8pt; color: #000; padding: 1px; font-weight: normal; text-transform: none; margin-bottom: 0px; margin-top: 0px; margin-right: 0px; margin-left: 0px; } h4 { cursor:default; background-color: #505050; font-size:7pt; font-family:arial; letter-spacing:0px; line-height:8pt; color: #000; padding: 1px; font-weight: normal; text-transform: none; margin-bottom: 0px; margin-top: 0px; margin-right: 0px; margin-left: 0px; } h5 { cursor:default; background-color: #606060; font-size:7pt; font-family:arial; letter-spacing:0px; line-height:8pt; color: #000; padding: 1px; font-weight: normal; text-transform: none; margin-bottom: 0px; margin-top: 0px; margin-right: 0px; margin-left: 0px; } blockquote { cursor:default; background-color: #505050; font-size:7pt; width: 270px; text-align: left; font-family:arial; letter-spacing:0px; line-height:8pt; color: #000000; border: 1px solid #000000; padding: 1px; font-weight: normal; text-transform: none; margin-bottom: 0px; margin-top: 0px; margin-right: 0px; margin-left: 0px; } .special { font-family: Tahoma; font-size: 7pt; color: #293763; font-weight: bold; line-height: 7pt; } a:link { text-decoration: none; font-family: verdana; font-weight:normal; font-size:9px; line-height:10px; color: #000000; letter-spacing:0px; text-align: justify; } a:visited { text-decoration: none; font-family: verdana; font-weight:normal; font-size:9px; line-height:10px; color: #000000; letter-spacing:0px; text-align: justify; } a:hover { text-decoration: none; color: #c0c0c0; border-bottom: 1px dotted #ffffff; } a.nav, a.nav:link, a.nav:active, a.nav:visited { text-decoration: none; font-family: verdana; font-weight:normal; font-size:9px; line-height:13px; color: #ffffff; padding: 1px; display:block; letter-spacing:0px; border-bottom: 1px solid #505050; border-left: 0px solid #000000; padding: 0px; text-align: left; background: #606060; text-transform: none; } a.nav:hover { text-decoration: none; font-family: verdana; font-weight:bold; font-size:9px; line-height:13px; color: #000; border-bottom: 1px solid #ffffff; border-left: 0px solid #000000; background: #808080; letter-spacing:0px; display:block; text-transform: none; text-align: left; } input, select { color: #FE7785; background: #ffffff; font-size: 7pt; font-weight: normal; font-weight: bold; text-decoration: none; font-family: Tahoma; text-align: center; border-width: 1px; border-style: solid; border-color: #000000; } textarea { color: #000000; height: 15px; width: 88px; text-transform: uppercase; background: #ffffff; font-size: 5pt; font-weight: normal; text-decoration: none; font-family: small fonts; text-align: center; border-width: 1px; border-style: solid; border-color: #000000; }

Step 2: After pasting the code save the page. Then copy the URL adress of the CSS page and paste it in this code where it says PAGE URL HERE:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link rel="stylesheet" href="PAGE URL HERE" type="text/css" /> </head>

Step 3: The code over has to be on ALL your pages! When you want change your CSS code you only have to change the page you called CSS and all the pages will be changed aswell. This will save you alot of time when you update.

Copyright (C) 2007-2008 vejc-design.com. All rights reserved.
WP | ONE | GA | PB | CC

Advertising

Want to be here?

Top Affiliates

Jessica Jabed

Fatima Vicky

Gunnstein Kristin

Anna Jack

Lise Tori

MORE?

the owner

Vibeke. 20 years old. February 23. Norway. Asker. green eyes. brown hair. soccer player.
Loves: Jan Christopher. kebab. friends. Dolly+Ferdinand. Kumsen. money. pizza. snowboard. my green car. surprises. candy. coca cola. LOST. Prison Break. Ugly Betty. sun. Nickelback.
Hates: arrogant/fake people. school. toes. rain. stealers/copiers. homework. teachers.

MORE?

Calendar

October 2008

M T W T F S S

« Sep

1 2 3 4 5

6 7 8 9 10 11 12

13 14 15 16 17 18 19

20 21 22 23 24 25 26

27 28 29 30 31

Domain

Owner: Vibeke
Host: one
Site name: vejc-design.com
Online since: 4. October '07
Hits:
Online: Online
Last updated: 7. October '08

MORE?

Layout

Layout up since October 1. It was made by Vibeke in Paint Shop Pro 9. Featuring Vibeke & Jan Christopher. Fonts used: Ambrosia. Texture from here.

link me

MORE?

Updates

October 7

1 coded layout
Changed "the owner" section

October 6

Layout challenge #5

11 PNGs

October 5

1 tutorial

7 textures

Ad challenge starts

9 PNGs

October 2

8 PNGs

Ads

Ad challenge

This list does not show the top referers, it only shows the last hits I have received. I will keep it a secret who wins untill October 26. Good luck everyone:)