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 Basics – Understanding Selectors
Easy-to-follow introduction to CSS selectors; how you apply different styles to different things in CSS.
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.

Tags:

Make Better Web Pages!

How to make your web site sell - use my secrets

Find out How

Do you love our approach to crafting simple & effective web sites that just work for people?

We'd love to hear about your web strategy.

Contact one of our team today!

2 Comments

  1. hannah says:

    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

Leave a comment

Articles + tutorials in HTML / CSS

Complete List of HTML/xHTML Tags, With Guide to Proper Semantic Use
My Complete List of HTML/xHTML Tags, With Guide to their Proper Semantic Use
Semantic HTML Handbook – Benefits of Writing Semantic HTML
Free article on Semantic HTML. Why you should learn Semantic HTML. Benefits for SEO and code reuse explained.
A Few Tips and Tricks to Write Better Semantic HTML
Tips and tricks for writing better semantic HTML or xHTML from a professional web producer
Building a web page with HTML & CSS for complete beginners
Learn what HTML is and how to build a website from scratch. A guide to creating a web page using HTML and CSS for people with no prior knowledge
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.
Web page production with xHTML and CSS (ebook)
Introduction to Semantic HTML
A Basic Guide to writing semantically correct semantic HTML or xHTML markup
Anatomy of HTML/xHTML tags
HTML basics tutorial: Learn HTML tags, covering the most common attributes
Introduction to Cascading Style Sheets (CSS)
Beginner's introduction to Cascading Style Sheets (CSS), learn CSS.
Making a Tabular list in HTML
Create an appealing tabular list using HTML, CSS and JavaScript
How HTML, CSS and JavaScript work together in web pages
Best practice for using HTML, Cascading Style Sheets, and JavaScript together to make web pages.
HTML Tables – when and how to use tables in HTML
When to use tables in HTML, and how to do it properly
Block vs Inline display style in CSS
An article explaining the differences between block and inline display property in CSS. Gives examples of CSS Block vs Inline CSS and how they are applied in CSS/HTML files and pages.
Datasheet-style form using HTML and CSS
Make a datasheet-style web form using HTML, CSS and JavaScript
Inheritance and Cascading Styles in CSS Explained
Introduction to CSS inheritance and how styles apply in CSS through inheritance and cascading. Read this guide detailed guide on using CSS inheritance.
HTML Lists: unordered, ordered and definition lists
My guide to HTML lists explains the 3 main types of lists web browsers support and how to implement them in HTML / xHTML
HTML, how to code HTML/xHTML markup
Free HTML tutorials: Learn top-quality web page production skills using HTML/xHTML markup
Using CSS (Cascading Style Sheets)
Free tutorial on learning CSS for web design and development
Introduction to HTML – basics of HTML
Introduction to basic HTML tags and the structure of HTML documents.
© Scratchmedia Limited, 2006-2010
Floor 3, 111 Buckingham Palace Road, London, SW1W 0WQ, UK
+44 (0)207 1600 989