FRIHOSTFORUMSSEARCHFAQTOSBLOGSDIRECTORY
You are invited to Log in or Register a Frihost Account!

Good sites to learn css?

 


Crinoid
Sorry for so basic question, but can you recommend some sites to learn usable css? Not outdated ugly basic solutions nobody uses anymore.
I see my problem as having different perception and needing translation from "function required" to "how it is named in css".
Example:
I'm now keeping in my hands CSS Pocket Reference. You know: the small book with two trouts on the cover. And feeling like this was made for the people with a different frame of mind: Rule structure, selectors, values precedence... Property reference is completely useless for me.
What happened to how to make a single or two columns page, mixed columns after that, draw the line after that, making this but not that type of menu approach? Or at least the dictionary for translating from human language to css terms to look for?

In html it's easier: enter in the search font color or relative and absolute links, and you get at once what you need.
Not so with css: columns, mixed columns, positioning search show either unusable or outdated things.
I tried to find how to make two short columns after a wide single text column, on a page with sidebar and single column of text. No luck.

Yes, a already read a lot of tutorials, including w3schools, on how css works. This doesn't help and even pollutes the perfectly clear solutions that exist somewhere but impossible to find within one day (for every small thing you need to find).

Does it make sense to you? Sorry about my English, doing my best.
Borderline: looking for a links to a good sites to find how to make contemporary (not not used anymore) elements for websites, not the tutorials with primitivization and oversimplification - I already read them.
Thank you.
Raidation
Usually, I just go on Google and search up whatever I need.

However, w3schools could be good.

http://www.w3schools.com/css/
Crinoid
I don't know how to call it then.

Can you help with some examples:

1. How to create the complex background consisting from full screen wide bottom and middle images, and a header images(left and right parts of header, with white background in between), with overlying small image that covers in part both bottom and middle of the bottom and middle images?

2. Same with almost transparent boxes (with visible borders) containing different parts of text or menu?

3. As alternative, the same semi transparent box for a text, moving over background. How to?

4. How to make, say, few planets on background, here and there, without making 500kb large background? And if the ling text was added, it should stretch to required length.

5. Contemporary solutions for the round corners of the text boxes? There were some, but in other places they were mentioned as obsolete.

6. Imagine the page with menu on the right and text on the left. After a couple of paragraphs of text should be two columns of the text, then again the single column of the text. What is the term to search for? Mixed columns doesn't show anything useful.

7. And if they exist, articles on how to convert the Joomla or WordPress template (index.php to index.html) to the static website template, css-html? That refer frequently to server side functions.

Apart from "hire designer" Laughing

So far I know how to create a single element background, saw the obsolete methods for rounded corners, saw how to overlap elements (Z-index) - but this is the permanent composition of images on template, converted php template to html in blindfolded butcher way. Would like to learn the better ways.

Another thing, copyright of the examples in the sites like w3schools and CSS Zen Garden: nobody can use their css solutions and snippets from. Where to find css solutions that could be used by anyone? Where css syntax ends?
Asap170
I've used w3schools and tizag. www.tizag.com

They both are really good.
sonam
You can see lot of nice examples (meues, backgrounds, boxes, layouts, etc.) on cssplay.co.uk and some of them are free for use, some of them need donation.

Sonam
Crinoid
Sonam, will it be legal? Templates are free to use and modify, with links at the bottom left intact. If use, say, 10 elements from different designers, then it will be quite a list at the bottom with name of each template and link to designer.

Tizag.com is good, answers gradient background and positionin gparts of background.

Answering myself to the previous my post (I spend two days again to find two terms):
Quote:
semi transparent box for a text, moving over background. How to?

"background-attachment:fixed" or PNG with alpha-channel transparency or transparent background GIF.
Quote:
How to make, say, few planets on background, here and there, without making 500kb large background? And if the ling text was added, it should stretch to required length.

Positioning background from tizag.
Quote:
6. Imagine the page with menu on the right and text on the left. After a couple of paragraphs of text should be two columns of the text, then again the single column of the text. What is the term to search for? Mixed columns doesn't show anything useful.

Hopefully, it is divs inside div, two-column floated layout with clear both after they end.

Who can, please correct it or add the terms for a search Cool
sierramultimedia
One I would recommend would be Pixel2life (user posted tutorials).

http://www.pixel2life.com/tutorials/css_stylesheets/
Parkour_Jarrod
I learned trial and error, using notepad++ seeing what was a command and what wasn't
Stanley9811
To be very honest, I found the best way to get a hold of it was to use Templates other's made until I was confident enough in knowing what a neat CSS looks like and where everything goes before I started making my own. Now it's just second nature.
Allstarat987
I suggest looking at HTML Dog. I recently just started looking into it after looking at w3schools, and many others, and I find it more helpful than most.

But for answers to your questions, if you find those answers let me know, cause I am learning to Razz
sierramultimedia
There are some great books out there aswell. I have read the following books and would like to recommend them to anyone out there.

http://www.amazon.co.uk/CSS-Mastery-Advanced-Standards-Solutions/dp/1590596145/ref=sr_1_14?ie=UTF8&s=books&qid=1250602477&sr=8-14

http://www.ndesign-studio.com/blog/reviews/wordpress-complete-book/

Hope this helps.
welshsteve
There are literally hundreds but these are my favourites.

W3 Schools

HTML Forums - tons of knowledgable people to help you out if you're stuck. Look out for coothead, he's a real CSS guru Smile

BonRouge (HTML Forums User)

A List Apart - web design magazine online but a good resource
lekaizer
I have to learn a web language, do you think is better if I start with CSS ?
welshsteve
Just CSS won't get you anywhere, as CSS is the language you use to style XHTML/HTML tage. A good starting point is to learn XHTML and CSS together.
rajpk
i think w3school is best
but as you said not basic
dear learn basic and try to merge all these simple & basic to make a pwerfull attractive and rich CSS
if you know basics you can do that but it will required time

you know we learn basics of c++ java HTML and after that make powerful contents

if you want a ready made it will be a copyright you have to give links of site
search google
e.g attractive menu using css

simple method to learn complex rich attractive css is following
search some site & right click see thier source
you will see "css" and you will learn there

best of luck
go0gle
I second W3Schools
Related topics

Creating a layout complete with css
i want to learn
CSS div alignment issue, IE and FF (newbie problem)
CSS - CSS Tutorial for skin maker
Which scripts are the most useful to learn?

HTML sites made cheap here!!!
CSS: How do i use images for borders?
Hello from Steve
Any professional web designers here?
I need some help

CSS - Where to start off..?
CSS website
Boffel Production with new site design!
good css guide..
CSS
Reply to topic    Frihost Forum Index -> Scripting -> Html, CSS and Javascript

FRIHOST HOME | FAQ | TOS | ABOUT US | CONTACT US | SITE MAP
© 2005-2007 Frihost, forums powered by phpBB.