|
-
September 8th, 2002, 04:30 AM
#1
Easier txt formatting with CSS
Ok after looking at some of the pages on OSWD I noticed that some of them used CSS (cascading style sheets) so I decided to have a wee look into them and see if they can make writing html easier!
Now I have read a bit on how to use them I thought I'd spread the knowledge a lil in the hope that'll it'll help someone else on AO out a lil....
here goes...
What is CSS?
CSS or cascading style sheets are a way of setting the different properties of a webpage alot easier than typing it up everytime!!
It means that instead of having to write <font size="2" color="#ffffff" align="left"><u> all the time you could just write <u style="main">
But in order for that to work you have to define your style sheet
defining style sheets
You have to define your CSS between the <head> tags of your html document and it would look like this
<head>
<STYLE type="text/css">
<!--
.main { color: #ffffff; font-size: 2; text-align; left }
-->
</STYLE>
the makes the txt invisible so your browser doesn't try and display it
now .main is you class name and the bits between the { brackets is the formatting
note that you don't have to leave the spaces - i do as i feel it makes it easier read but you do have to put a semi-colon between each!!
what tags can i define?
H1 through H6
P
BODY
A:link (That denotes the unvisited link)
A:visited (That denotes the visited link)
DIV (That denotes a division of the page)
and as you saw above you can also alter text by placing the style= after any thing that alters text like <u> or [b]
Using more than one class
You can apply many different classes to a single thing but just make sure to use different code words
Asiging different classes to the same tag
You can assign multiple classes to the same tag such as
H3.fst {font-size: 20pt; color: #FF00FF}
H3.scd {font-size: 20pt; color: #FF00FF}
just by placing a different keyword after a fullstop
Using 1 style sheet for multiple pages
You can also set up one style sheet and have your pages link to it to recieve the formatting information
<LINK REL=stylesheet HREF="http://www.your.page/yourstylesheet.css" TYPE="text/css">
the above command calls the style sheet
In order to set up a style sheet just open a new .txt doc now type up your style sheet - this will be the only thing in the txt doc - no <head> tags this time!
Save it and change its extension from .txt to .css
Then upload it to the location specified in <LINK REL
Sources
Ok thats about all I learnt so far tonight - when I get to use them a bit more myself I might do a more detailed tutorial on them 
heres where i got my info ->
enjoy
v_Ln
Posting Permissions
- You may not post new threads
- You may not post replies
- You may not post attachments
- You may not edit your posts
-
Forum Rules
|
|