html tutorials

ever wondered what all that stuff means in a layout stylesheet?

fonts in your stylesheet!
.orangetext15 = about me, who i'd like to meet, blurbs
.blacktext10 = date of comments
.blacktext12 = extended network text
.whitetext12 = text above url, contact table, and details/interests
.nametext = the text above your picture/display name
.text = basic font for your page
.redtext = font for the number of comments you have
.redbtext = font for the number of friends you have
.lightbluetext8 = font for titles in your details and interests

change the font styles!
You take one of the codes from above like .orangetext15 and then add stuff to it like: font-family, font-size, color, text-decoration, line-height, text-transform, and font-weight.
When you put it all together you get something like this:

.orangetext15 {font-family: tahoma; font-size: 11px; color: black; text-decoration: none; line-height: 12px; text-transform: lowercase; font-weight: bold;}

Make sure you remember to put the { brackets } or the codes won't work.

what all that stuff means!
Now if you are wondering what that stuff means inside the brackets then I will explain:

font-family = the type of font like tahoma, arial, or georgia. there are many other kinds of fonts, but those are just a few popular ones.
font-size = that is the size of your font like 11px would be a good size, 30px would be huge, and 5px would be so tiny you probably couldn't read it and px stands for pixel.
color = is pretty obvious that it is the color of your font like black, white, red, or orange, or you can use hex color codes like 000000 or FFFFFF which are black and white.
text-decoration = is if your text has any decoration on it like an underline.
line-height = this is the height of your line, so if you make your font size 11px and your line height 7px then your words will probably get chopped off, so you should make the line height a couple pixels bigger than your font size.
text-transform = is if your font is lowercase, uppercase, your normal. lowercase will make your font lowercase, uppercase will make your font uppercase, and normal will make it uppercase and lowercase depending on how you type.
font-weight = this is the weight of your font like bold, or normal. bold will make your font thicker and normal will make it just regular.

what are style tags for?
First of all, let's make sure you know what style tags even are. Style tags are the things you see at the very beginning of a code and at the very end of a code, so if you have a whole layout code put together then it should look something like this:

< style >
.orangetext15 {font-family: tahoma; font-size: 11px; color: black;}
.nametext {font-family: tahoma; font-size: 11px; color: black;}
.blacktext10 {font-family: tahoma; font-size: 11px; color: black;}
.text {font-family: tahoma; font-size: 11px; color: black;}
< / style >

THE STYLE TAGS ARE NOT SUPPOSED TO HAVE SPACES IN THEM, BUT I HAD TO DO THAT OR ELSE YOU WOULDN'T BE ABLE TO SEE IT.

background image or color!
You have to start out with this:
body { }
and then you add stuff like this inside the brackets, background-image:URL HERE!; or background-color:COLOR HERE!;
You must also add background-attachment: fixed OR scroll; background-repeat: repeat OR no-repeat; background-position: bottom left OR bottom right OR top right OR top left OR center;
In the end you should have something that looks like this:

body {background-image: url(); background-color:; background-repeat:repeat; background-attachment:fixed; background-position: bottom left;}

You can have a image url and a background color in at the same time, but if you have a image url in there the image will show up and not the color, and if you have the background-repeat on repeat then it doesn't matter what the position is.

august 22nd
- 20 new style 6 default w/ hide codes layouts.
- 10 new awesome style color table layouts.
august 20th
- 20 new style 6 default w/ hide codes layouts.
- 10 new style 2 default w/ hide codes layouts.
august 15th
- 10 new awesome color table layouts.
august 11th
- 10 new skinny style layouts.
august 9th
- 2 new website layouts.
august 8th
- updated the tv & movie reviews.
- updated the top 10 music page.
- added the my story page under fun stuff.
august 7th
- 8 new edited pictures.
- 20 new default with hide codes layouts.
- 10 new regular default layouts.
- 5 new black table default layouts.
august 6th
- 5 new premade signs.
- 3 new blended photos.
august 4th
- 10 new color navigation bar layouts.
august 1st
- 10 new color navigation bar layouts.
july 27th
- 10 new black defaults.
july 22nd
- 40 default with hide codes layouts.
july 19th
- 10 new skinny layouts.
july 18th
- 10 new regular layouts.
- 5 vector backgrounds.
- 14 about me banners.
july 16th
- 5 new music skins.
- 10 new regular layouts.
july 12th
- 10 new default w/ hide codes layouts.
- 6 new color nav bar lyts.
july 6th
- 10 new default w/ hide codes layouts.
july 4th
- 14 new color nav bar lyts.
- 18 new aim icons.
- 14 new content banners.
july 3rd
- new stuff of the month.
july 1st
- 6 new comment boxes.
advertise now! advertise now! advertise now!
advertise now!
online
Web Site Visitor Tracking