Using CSS (Cascading Style Sheets)
Cascading Style Sheets is a technology that has been around for several years. It's a great way to assign style properties to HTML elements in your web pages, and offers several significant benefits over the old way of putting style information directly into HTML tags.
Benefits of CSS
CSS is flexible
Styles can be written in one place (separate style sheets) and assigned to HTML elements through class or ID properties. It’s way easier and quicker to change styles across a whole site when they’re defined in one place.
CSS is Lightweight
Using CSS (like class=”main-nav”) creates far smaller HTML files than writing style into every HTML tags (like border=”1″ cellpadding=”3″ cellspacing=”1″ backgroundcolor=”#ffc”).
CSS helps separate style from content
Keeping your style definitions separate from your content and content-structure makes it possible to re-purpose the same content for different media. This includes styling pages differently for printing, as well as other user agents like voice (text-to-speech) and mobile devices.
CSS for Web Design: Contents
- Introduction to CSS
- Beginner’s introduction to Cascading Style Sheets (CSS)
- Inheritance and Cascading Styles in CSS
- Introduction to how styles apply in CSS through inheritance and cascading.
- Block vs Inline display style in CSS
- HTML elements can be displayed either in block or inline style. The difference between these is one of the most basic things you need to know in order to use CSS effectively.
- Datasheet-style form using HTML, CSS and JavaScript
- Make a datasheet-style web form using HTML, CSS and JavaScript
- Tabular list-style form using HTML, CSS and JavaScript
- Create a tabular list-style web form using HTML, CSS and JavaScript
- Keeping your content in order of priority with flexible CSS layouts.
- How to keep your most important content at the top of your page, no matter what kind of column layout you wish to achieve.
Other CSS resources
- Style Master CSS tutorial
- A very good place to get a broad overview of what CSS is and what you can do with it.
- CSS Help pile
- A great collection of links to CSS tutorials, ranging from moderate to advanced level
- CSS3.com
- A thorough reference of CSS properties, with examples.
- 40 free CSS layouts for you to use
- Multi-column, fixed or liquid layout, every combination is here, tried & tested.
- Yahoo! UI Library: Grids CSS
- (Not for beginners) Grids CSS is a suite of seven web page templates and the ability to nest grids of one to four columns within the content area of those templates. Together, the combined template and grid system enable you to implement over 100 different CSS layouts using only 1.82KB of includes.
Master the Full Range of Pro Web Skills
The Complete Pro Package…
Ben Hunt's Pro Web Design Alliance
Joining the Pro Web Design Alliance is your chance to be part of the new generation of successful online marketers and designers.
This exclusive group is truly unlike anything else in the world. As well as being first to get the latest thinking in online design and marketing, you'll also enjoy support to help make your business more profitable.
Alliance membership includes Ben Hunt's comprehensive “Pro Web Design Course”, plus many many other benefits.
MASTER Search Engine Optimisation
with SEO from Scratch
SEO from Scratch is the perfect guide to optimizing small business websites.
This new video series:
- Explains what SEO is all about, then
- Shows you exactly what to do and how to do it
- Plus — gives you free tools to do it
The Must-Read... Save the Pixel - the Art of Simple Web Design
Save the Pixel is THE original and best guide to simple web design. This iconic book makes the fundamentals of web design easy to understand. (Now in its 2nd edition)
“Brillant, just brillant! Just what is needed! A must read for anyone who designs and develops web sites.”
“It has revolutionised the way that I think about websites and I only wish I could have read it sooner.”
7 Comments Leave a comment
Leave a comment
Pingback: Week4-3 article about css « Weichingweng's Blog
i’m I.T. student one of my subject now is CSWDO3 i need your help to know about XML,CSS and javascript .
Thank you
Thanks you so much for all those links. Being a newbie, I appreciate blogs like yours that extend so much assistance for web designers.
i want to create a website using css can you please help me out , i don’t no how to use it exactly
There are a few tutorials on this site, but the best resource is the Pro Web Design Course. I am planning to release some smaller sections of the course in a couple of months.
loved the details and I had to do a school project, it really helped!!!
Of course you did it was a good website