CSS Tutorial

whitefangwhitefang BeginnerLink Clerk
in Coding Languages
CSS Introduction

What is CSS?
CSS (cascading style sheets or style sheets) allows you to specify the style and layout of many web pages at once by making changes to a single style sheet.

Style sheets are files with instructions on how to present a web page(s) in a web browser such as Firefox or Internet Explorer. CSS instructions can be within the web page itself, or in a separate document which is linked to the web page.

CSS allows you to specify properties on one of your web pages. This allows you to make changes to many web pages at once.

Before you learn CSS
Before you learn CSS, you should have at least a basic understanding of HTML/XHTML.

Benefits of CSS
  • Your web pages load faster because there is less code to transfer
  • There is less code to type
  • It is easier to have a consistent look and feel to your entire web site
  • Updating and maintaining websites is much easier and less time consuming

CSS also allows you to:
  • Position text and graphics precisely where you want to
  • Add rollover effects to links
  • Control the spacing between letters, lines, margins, web page borders
  • Specify the units such as centimeters, pixels, points and more
  • Use multiple stylesheets in browsers such as FireFox, effectively allowing for multiple themes.
  • Hide content from certain web browsers in certain situations. An example of this is when you have some content that you want to appear only in your web pages, but not in print.

Web Browser Compatibility
You should know that different web browsers interpret CSS standards in different ways and will want to see how your website looks in at least the most popular browsers. Some older browsers are not able read CSS at all, although this is very rare now and steps can be taken to handle these situations. You will also want to see how your website looks in different screen size.

Many issues with CSS these days come from Internet Explorer 6, which is well known in the web design industry for having poor support for modern web standards such as CSS2 and XHTML 1.0.
Microsoft is aiming to rectify this with Internet Explorer 7, which should have better support for CSS2 and XHTML as well as some support for the CSS3 standard, which is only just being added to other browsers.

There's a few CSS "hacks" which will usually allow you to get arounf Internet Explorer 5 for Mac and Internet Explorer 6 issues without breaking standards compliance (for example, Internet Explorer has poor support for the :hover psuedo class), or you can use server side scripting to examine the end users details, allowing you to see what browser they are using so you can set a different CSS file based on their client (such as different CSS files for FireFox and Internet Explorer).

Comments

Sign In or Register to comment.