navigation
a webmaster learning community
     Home    Register     Search      Help      Login    
Sponsors

Shopping Cart Software
Ecommerce software integrated into Frontpage, Dreamweaver and Golive templates. No monthly fees and available in ASP and PHP versions.

Website Templates
We also have a wide selection of Dreamweaver, Expression Web and Frontpage templates as well as webmaster tools and CSS layouts.

Frontpage website templates
Creative Website Templates for FrontPage, Dreamweaver, Flash, SwishMax

Search Forums
 

Advanced search
Recent Posts

 Todays Posts
 Most Active posts
 Posts since last visit
 My Recent Posts
 Mark posts read

Microsoft MVP

 

CSS

 
View related threads: (in this forum | in all forums)

Logged in as: Guest
Users viewing this topic: none
Printable Version 

All Forums >> Web Development >> Cascading Style Sheets >> CSS
Page: [1] 2   next >   >>
 
DaveX

 

Posts: 207
Joined: 5/4/2004
Status: offline

 
CSS - 7/11/2005 18:45:10   
Can anyone explain to me simply what CSS is and does? Benefits and drawbacks? I know this may sound silly but I just don't get it.
dpf

 

Posts: 7121
Joined: 11/12/2003
From: India-napolis
Status: offline

 
RE: CSS - 7/11/2005 19:13:12   
css = cascading style sheets... the word sheets is somewhat deceiving because css can be included in your page or in a seperate file. frankly, there are no drawbacks to css. when it first came out, the huge drawback was that the late 90s browsers didnt support it.

at its simplest, css allows you to describe "styles" that are applied accross the entire page or multiple pages with a single line. A few years ago, I was asked to give a price on changing the font in a web site from red to blue - simple, eh? well, I quoted $400 and the owner was shocked. I didnt make the site and it didnt use css - instead, every paragraph in every one of 450 pages had the <font tag with attribute color="red". each had to be changed. an external stlye sheet would have had that description one time accross all 450 pages.

Im not even doing it justice so I will leave it for others to give you a better answer.

_____________________________

Dan

(in reply to DaveX)
DaveX

 

Posts: 207
Joined: 5/4/2004
Status: offline

 
RE: CSS - 7/11/2005 19:18:08   
So, basically, it's a set of instructions revolving around the layout and look of the site that is refered to by all the pages in the site?

(in reply to dpf)
dpf

 

Posts: 7121
Joined: 11/12/2003
From: India-napolis
Status: offline

 
RE: CSS - 7/11/2005 19:28:20   
exactly..the beauty of css is that it can get incredibly complex and do amazing things but that domplexity, which can be scary, can be arrived at slowly. you can start with very very simple things like control fonts and move on gradually. there are some css zealots here who love to guide newcomers..<smile> ultimately, it reaches the point where it can be used for postioning; placing elements on the screen exactly where you want them and even 3 dimension - oneoverlapping another which previously you needed to do in a graphics program and insert into html as an image.

_____________________________

Dan

(in reply to DaveX)
DaveX

 

Posts: 207
Joined: 5/4/2004
Status: offline

 
RE: CSS - 7/11/2005 21:26:21   
I'm intrigued...

(in reply to dpf)
Tailslide

 

Posts: 5915
Joined: 5/10/2005
From: Out here on the raggedy edge
Status: offline

 
RE: CSS - 7/12/2005 4:06:15   
CSS is a method that you can use to completely separate off your content and the layout and presentational information. All the layout and presentational info can be stored in one or more separate stylesheets which apply globally across your site. This means that your site becomes leaner and faster and easier to edit. Wonder what your site would look like with a serif font? Easy - just change it in one place and see - if you don't like the result then change it back. About 1 minute's work max.

Because the HTML page will now just have content (and surrounding <p>s and <br />s for instance) the pages download faster and take up less space on the web server - which could save you money!

You could have two (or any amount actually) completely different looks for your site without messing with the content at all - users would be able to switch between site styles by clicking a link which would switch the stylesheet that's applied to the page. CSS Zen Garden is a prime example of CSS used this way - it's the same HTML page with different stylesheets applied. http://www.csszengarden.com/

The downside is that it's a different way of thinking from tables etc - it'll take a while to really grasp it. But then again it took a while to learn tables in the first place! The other major downside is making sure the CSS you use is understood by all browsers. Unfortunately the world's current favourite browser doesn't interpret all the CSS "rules" as it should which can mean a fair bit of fiddling to get sites to look the same in IE as they do in more standards compliant browsers such as Firefox or Opera. (No browser is 100% perfect - it's just a question of scale of incompetence!).

There's quite a nice CSS tutorial here: http://academ.hvcc.edu/~kantopet/css/index.php But you'll find there are loads of resources out there for people learning CSS.

In the end it takes a fair bit of effort to learn CSS - is it worth it? Oh yes - the initial effort will make your life easier long-term. There are some excellent books out there too and we CSS Zealots (:)) like nothing better than helping people make the change!

_____________________________

"My strategy is so simple an idiot could have devised it"
Little Blue Plane Web Design | Blood, Sweat & Rust - A Land Rover restoration project

(in reply to DaveX)
womble

 

Posts: 5461
Joined: 3/14/2005
From: Living on the edge
Status: offline

 
RE: CSS - 7/12/2005 4:07:41   
You're best visiting the Cascading Style Sheets section of the forum then (though try not to get scared off by the cries of 'Help! Why won't it do what I want it to do?!'

Like Dan says, you're probably best starting off with the styling of fonts etc., then moving on to the more complex stuff.

If you're interested in CSS, there's a number of websites that show the possibilities of CSS...

http://www.csszengarden.com/
http://www.tanfa.co.uk/
http://positioniseverything.net/
http://www.meyerweb.com/eric/css/
http://cssvault.com/cat_navigation.php
http://www.alistapart.com/

...just a selection of the sites that inspire me. (Not forgetting of course, here!) I'm sure someone else'll be along with more of their favourite CSS sites.
(Be warned though, it's addictive! :) )

_____________________________

~~ "A cruel god ain't no god at all" ~~
:)

(in reply to DaveX)
caz

 

Posts: 3468
Joined: 10/10/2001
From: Somewhere south of Chester, UK
Status: offline

 
RE: CSS - 7/12/2005 6:11:53   
A good place to start is in the Tutorials section on the blue bar at the top of this page where there is a very concise introduction to CSS by Katherine Nolan. An introduction to CSS.

The MS site also has an introduction and training for using CSS with FP2003 here

It's best to understand the editor that you are using as well as the basics of css, so that there is less chance od disappointment/frustration later on.:)


< Message edited by caz -- 7/12/2005 6:46:11 >


_____________________________

Do not meddle in the affairs of cats, for they are subtle and will dance, or more on your keyboard.
Cheshire cat. www.doracat.co.uk

I remember when it took less than 4hrs to fly across the Atlantic.

(in reply to womble)
DaveX

 

Posts: 207
Joined: 5/4/2004
Status: offline

 
RE: CSS - 7/12/2005 14:14:08   
So is the CSS stored within a particular page and referenced by other pages or is it stored in the directory?

(in reply to caz)
dpf

 

Posts: 7121
Joined: 11/12/2003
From: India-napolis
Status: offline

 
RE: CSS - 7/12/2005 14:20:07   
there are 3 types of css
1. in-line where you have a style that only impacts that line of html
2. embedded which is within a <style></style> tag set placed in the head section and which impacts the entire page but only this page
3. external - you place you css in a text file and usally name it with a .css extention and then link to it -every page that links to it will be impacted -- so if you name your file style.css, you add this in the head section:

<LINK href="style.css"
type=text/css rel=stylesheet>
the cascade part derives from the fact that the closest of the three prevails. for example, if the external says that the basic page text is red but the embedded says an H1 header is blue, the headers will be blue. however, if an in-line style for H1 says red, that (and only that) H1 will be red.

_____________________________

Dan

(in reply to DaveX)
womble

 

Posts: 5461
Joined: 3/14/2005
From: Living on the edge
Status: offline

 
RE: CSS - 7/12/2005 14:25:24   
The CSS file's a text file that's saved with the extension css, if you're using an external stylesheet, e.g. styles.css. It's linked to each page of the website in the <head> section - either by something like:

<link rel="stylesheet" type="text/css" href="styles.css" media="screen" />

or the '@ import' directive, e.g.:

<style type="text/css" media="all">
@import "style.css";
@import "advanced.css";
</style>






_____________________________

~~ "A cruel god ain't no god at all" ~~
:)

(in reply to DaveX)
bobby

 

Posts: 11394
Joined: 8/15/1969
From: Seattle WA USA
Status: offline

 
RE: CSS - 7/12/2005 15:15:08   
www.w3schools.com/css

great first place to start (though Kathrines tutorial is pretty good too :))

Once you start using CSS you will never go back :)

_____________________________

If con is the opposite of pro, is Congress the opposite of progress?


:)

(in reply to womble)
DaveX

 

Posts: 207
Joined: 5/4/2004
Status: offline

 
RE: CSS - 7/12/2005 15:32:04   
Can you add one after a site is built or does it need to go in at the beginning?

(in reply to womble)
dpf

 

Posts: 7121
Joined: 11/12/2003
From: India-napolis
Status: offline

 
RE: CSS - 7/12/2005 15:40:41   
oh it can be added anytime

_____________________________

Dan

(in reply to DaveX)
bobby

 

Posts: 11394
Joined: 8/15/1969
From: Seattle WA USA
Status: offline

 
RE: CSS - 7/12/2005 15:43:09   
That all depends really... if you have a bunch of <font> and <style> tags in your page code then it will override the CSS.

You can add the CSS any time... but it may take some work to strip out the old way of doing things...

:)

_____________________________

If con is the opposite of pro, is Congress the opposite of progress?


:)

(in reply to dpf)
womble

 

Posts: 5461
Joined: 3/14/2005
From: Living on the edge
Status: offline

 
RE: CSS - 7/12/2005 15:50:59   
There's no reason why you couldn't do it on an existing site, though it'd mean going through all your code manually and stripping out all the in-line styles if you're wanting to use an external stylesheet.

Similarly, with CSS positioning, you'd need to take out the tables and replace that with the CSS positioning rules for each element.

IMO it's probably easier starting from scratch so you can really get to grips with the css, especially it you're wanting to using CSS's positioning capabilities. Having said that though, there's no use re-inventing the wheel. My original site was done in FP using a table layout and I'm now redesigning it using xhtml and css. I'm doing the CSS from scratch, but copying and pasting the code from the original site wherever possible to save myself as much typing as possible, then tweaking and closing tags etc so it'll validate. Getting there slowly...:)

_____________________________

~~ "A cruel god ain't no god at all" ~~
:)

(in reply to DaveX)
bobby

 

Posts: 11394
Joined: 8/15/1969
From: Seattle WA USA
Status: offline

 
RE: CSS - 7/12/2005 16:09:00   
I would strongly recommend saving CSS positioning for later...

Stick with the formatting you use now, only use CSS to help you define it.

For instance, you can designate your table cell widths in the stylesheet while maintainting the table for the basic structure of the site.

Jumping head first into CSS positioning may turn you away from CSS. It's not easy to grasp at first, and never gets easy to impliment across all browsers...

Stick with defining colors, styles, sizes and such... worry about positioning later :)

_____________________________

If con is the opposite of pro, is Congress the opposite of progress?


:)

(in reply to womble)
womble

 

Posts: 5461
Joined: 3/14/2005
From: Living on the edge
Status: offline

 
RE: CSS - 7/12/2005 16:16:45   
quote:

I would strongly recommend saving CSS positioning for later...


True. Launching in with both feet isn't a good idea if you want to preserve your sanity, as I discovered :)

_____________________________

~~ "A cruel god ain't no god at all" ~~
:)

(in reply to bobby)
bobby

 

Posts: 11394
Joined: 8/15/1969
From: Seattle WA USA
Status: offline

 
RE: CSS - 7/12/2005 16:53:37   
Yep, agreed.

I tried to learn it all at once... for my masochistic mentality it worked out pretty well but for the average joe..?

:)

_____________________________

If con is the opposite of pro, is Congress the opposite of progress?


:)

(in reply to womble)
Tailslide

 

Posts: 5915
Joined: 5/10/2005
From: Out here on the raggedy edge
Status: offline

 
RE: CSS - 7/12/2005 17:15:07   
I did the "CSS or nothing" route too - nothing wrong with me (*twitch*).

I would imagine if you're doing it bit by bit you'll find that you'll reach a point in the CSS learning thing where the balance will tip and then you simply will not want to go back. If that sounds a bit "holier than thou" or smug then it's not meant to - it's just that the more you can do with CSS, the more you'll want to do with it.

You'll start off setting fonts and colours and pretty soon you'll be examining CSS Zen Garden stylesheets and swearing about IE - you'll see (*twitch*) uh huh, uh huh, you'll see...

_____________________________

"My strategy is so simple an idiot could have devised it"
Little Blue Plane Web Design | Blood, Sweat & Rust - A Land Rover restoration project

(in reply to bobby)
bobby

 

Posts: 11394
Joined: 8/15/1969
From: Seattle WA USA
Status: offline

 
RE: CSS - 7/12/2005 17:21:26   
the power to completely change the layout, colors and styles of your entire website from a single document is what enticed me.

:)


_____________________________

If con is the opposite of pro, is Congress the opposite of progress?


:)

(in reply to Tailslide)
c1sissy

 

Posts: 5079
Joined: 7/20/2002
From: NJ
Status: offline

 
RE: CSS - 7/13/2005 9:32:31   
quote:

Womble
True. Launching in with both feet isn't a good idea if you want to preserve your sanity, as I discovered


womble, I have to agree with you on this one! This is how I went at it. Full speed and full force. And since there is so much to learn, and this changes constantly, it is better to start with basics and work your way up.

btw, got your email and will reply sometime today

_____________________________

Deb-aka-c4Ksissy
high panjandurum and alpha female of the silverback tribe
As decreed by Jesper 5-24-2003.
The only stupid question is... the one that is never asked!!
http://directory.css-styling.com
http://fmsforum.com
http://positioniseverything.net/
http://www.tanfa.co.uk/

(in reply to womble)
DaveX

 

Posts: 207
Joined: 5/4/2004
Status: offline

 
RE: CSS - 7/16/2005 21:01:18   
Wow! Thanks for all the input!

(in reply to c1sissy)
womble

 

Posts: 5461
Joined: 3/14/2005
From: Living on the edge
Status: offline

 
RE: CSS - 7/17/2005 6:28:48   
quote:

I would imagine if you're doing it bit by bit you'll find that you'll reach a point in the CSS learning thing where the balance will tip and then you simply will not want to go back. If that sounds a bit "holier than thou" or smug then it's not meant to - it's just that the more you can do with CSS, the more you'll want to do with it.


True. I've all but forgotten how to do table layouts :) and if I can only get the floats to behave themselves I'd be happy with CSS...

quote:

You'll start off setting fonts and colours and pretty soon you'll be examining CSS Zen Garden stylesheets and swearing about IE - you'll see (*twitch*) uh huh, uh huh, you'll see...


Ah, swearing about IE! (*twich*) (it's catching!) - most of the problems I've encountered with CSS, IE's involved there somehow...

/dreams of a day we have a standards compliant IE - we can but dream...

_____________________________

~~ "A cruel god ain't no god at all" ~~
:)

(in reply to Tailslide)
FlowerPower

 

Posts: 67
Joined: 4/27/2004
Status: offline

 
RE: CSS - 7/18/2005 0:34:18   
I'm replying just to give the perspective of someone who only just recently embarked on the journey to CSS nirvana. I guess it's a never-ending journey, really, but I think everyone who's responded above are much further along the road than I. :)

I first started experimenting with CSS two years ago, but only did formatting stuff. I taught basic css to junior high school students as part of a basic course on HTML and web site making, but didn't have time to learn positioning properly at the time.

Now, I have a web site for my students made with frames - I can't believe I'm admitting to that :) - I've been meaning to fix it up for ages, but just haven't had time to make something new. However, just this last week I have completely redone it - actually, I have made it again from scratch using CSS for both formatting and layout this time. It is really cool, but was also quite frustrating at times when I just couldn't work out the positioning. Luckily, the people here are very friendly and helpful, and I got some help along the way.

I feel that just this last weekend, I have progressed immensely, and don't think I'll ever go back to any other way of designing my site. But I must say I agree with the above posts - you may easily feel yourself getting overwhelmed if you try to learn it all at once, so maybe just use tables for the layout, and use CSS for the formatting at first.

The cool thing, as was pointed out above, is that you can add things incrementally and test them out immediately. I find myself using http://www.w3schools.com a lot, and I like the TryIt editor they have there.

And then when I think I'm done, it's crunch time: http://www.w3.org has a CSS validator which is great for weeding out mistakes.

Good luck, and have fun!

(in reply to womble)
Tailslide

 

Posts: 5915
Joined: 5/10/2005
From: Out here on the raggedy edge
Status: offline

 
RE: CSS - 7/18/2005 3:53:48   
Thought of something else.

There are loads of on-line sources of information which you will probably come to rely on quite heavily (I do and I've been using CSS for 3 years).

That said - there are a couple of books which are really worth getting.

Designing with Web Standards - Jeffrey Zeldman - Very detailed book about CSS, web standards and other issues facing designers.
Web Standards Solutions - Dan Cederholm - Really excellent, easy to understand book about CSS styling and layouts etc.

_____________________________

"My strategy is so simple an idiot could have devised it"
Little Blue Plane Web Design | Blood, Sweat & Rust - A Land Rover restoration project

(in reply to FlowerPower)
jaybee

 

Posts: 13959
Joined: 10/7/2003
From: Berkshire, UK
Status: offline

 
RE: CSS - 7/18/2005 5:09:12   
quote:

womble, I have to agree with you on this one! This is how I went at it. Full speed and full force.


Me too and my therapist says I'm fine! :)

_____________________________

If it ain't broke..... fix it until it is.
:)

:)
GAWDS
Now where did I put that Doctype?

(in reply to Tailslide)
c1sissy

 

Posts: 5079
Joined: 7/20/2002
From: NJ
Status: offline

 
RE: CSS - 7/18/2005 8:06:55   
quote:

Me too and my therapist says I'm fine!


Your lucky then, my therapist wont even come near me now :):)

_____________________________

Deb-aka-c4Ksissy
high panjandurum and alpha female of the silverback tribe
As decreed by Jesper 5-24-2003.
The only stupid question is... the one that is never asked!!
http://directory.css-styling.com
http://fmsforum.com
http://positioniseverything.net/
http://www.tanfa.co.uk/

(in reply to jaybee)
briesmith

 

Posts: 67
Joined: 2/6/2003
Status: offline

 
RE: CSS - 7/19/2005 10:37:02   
CSS is the way forward but you'll still need tables but only for what they're really good at - ie presenting data in columnar format - rather than as a workround for all the things browsers won't do.

Talking about things browsers won't do leads me on to the question of IE versus FireFox versus Godzilla (sic) etc. Browsers usually don't malfunction because of incompetence but because the standards published by W3C and others require, depend on or allow interpretation and it's there that the differences creep in.

Two things are apparent in the browser world.

FireFox is now too big for the volunteer ethic to effectively support and drive it forward; the FireFox team's performance is now at least as bad as the Great Satan's and because it has wider presence it's now attracting the virus, worm and horse makers' attention.

The ever encroaching issue of standards will have the same effect on browser technology it had on COBOL. So many powerful interests will have massive investments in the status quo getting agreement for change will become impossible. COBOL was the programming language but even while millions of lines of it were continuing to be written every day it was already dying simply because it couldn't go forward.

This is the future for web software technology. The ony reason we continue to progress at all is because Microsoft don't give a tinker's for anybody else's opinion; once they're brought to heel that'll be the end.

Can you imagine any committee that included the US and Europe agreeing on anything? Can you hear the French representative ever saying, "that's a good idea, Bill"?

(in reply to c1sissy)
dpf

 

Posts: 7121
Joined: 11/12/2003
From: India-napolis
Status: offline

 
RE: CSS - 7/19/2005 12:07:26   
quote:

COBOL was the programming language but even while millions of lines of it were continuing to be written every day it was already dying simply because it couldn't go forward.
to me, thats like saying the model T died out because it didnt move forward - it died out because the core designcouldnt handle new develments after 20 years - cheaper and better to start building upon a new and more appropriate core. cobol was a 60's language that became outdated - not suited for objects and clunky - intended for mainframes and attempts to adapt to pc were made but couldnt compete with C based models

_____________________________

Dan

(in reply to briesmith)
Page:   [1] 2   next >   >>

All Forums >> Web Development >> Cascading Style Sheets >> CSS
Page: [1] 2   next >   >>
Jump to: 1





New Messages No New Messages
Hot Topic w/ New Messages Hot Topic w/o New Messages
Locked w/ New Messages Locked w/o New Messages
 Post New Thread
 Reply to Message
 Post New Poll
 Submit Vote
 Delete My Own Post
 Delete My Own Thread
 Rate Posts