HTML
  Home arrow HTML arrow Page 2 - CSS: Where Little Things Mean a Lot
Dev Articles Forums 
ADO.NET  
Apache  
ASP  
ASP.NET  
C#  
C++  
ColdFusion  
COM/COM+  
Delphi-Kylix  
Design Usability  
Development Cycles  
DHTML  
Embedded Tools  
Flash  
Graphic Design  
HTML  
IIS  
Interviews  
Java  
JavaScript  
MySQL  
Oracle  
Photoshop  
PHP  
Reviews  
Ruby-on-Rails  
SQL  
SQL Server  
Style Sheets  
VB.Net  
Visual Basic  
Web Authoring  
Web Services  
Web Standards  
XML  
Mobile Linux 
App Generation ROI 
IBM® developerWorks 
Sun Developer Network 
Weekly Newsletter
 
Developer Updates  
Free Website Content 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Write For Us Get Paid 
Request Media Kit
Contact Us 
Site Map 
Privacy Policy 
Support 
 USERNAME
 
 PASSWORD
 
 
  >>> SIGN UP!  
  Lost Password? 
HTML

CSS: Where Little Things Mean a Lot
By: Christopher Duell
  • Search For More Articles!
  • Disclaimer
  • Author Terms
  • Rating: 3 stars3 stars3 stars3 stars3 stars / 27
    2004-03-29

    Table of Contents:
  • CSS: Where Little Things Mean a Lot
  • On to CSS
  • CSS and the DIV Tag

  • Rate this Article: Poor Best 
      ADD THIS ARTICLE TO:
      Del.ici.ous Digg
      Blink Simpy
      Google Spurl
      Y! MyWeb Furl
    Email Me Similar Content When Posted
    Add Developer Shed Article Feed To Your Site
    Email Article To Friend
    Print Version Of Article
    PDF Version Of Article
     
     
    ADVERTISEMENT


    CSS: Where Little Things Mean a Lot - On to CSS


    (Page 2 of 3 )

    I can tell you want to get right to it and give the CSS stuff a go, so go ahead and make a file called ‘style.css’ and save it in the same folder as the HTML page you just made. Open it with a simple text editor, like Notepad, and add the following code:


    body{
    background
    #000000;
    color: #FFFFFF;
    text-align: center;
    font-size: 20pt;
    font-family: verdana, arial;
    }

    Save the file. Now add the following line in the HEAD tag of your HTML file:


    <link href="style.css" type="text/css" rel="stylesheet" />

    Now go and have a look at your web page again in your browser… a bit different isn’t it? Sure you could have done that with much less code by simply using <font> tags and <center> tags etc., but the main problem with this is that such tags are soon to be deprecated, and CSS is going to completely take over the way we do web design.  Also, if you wish to have a ‘vaild’ (according to the W3C) site, you will have to use CSS and not rely on these <font> tags, etc. That’s just the reason why you almost have to do this, but you should be looking at doing this anyway, as when you make your next page, all you have to do is add one simple line:

    <link href="style.css" type="text/css" rel="stylesheet" />

    It will look exactly like your first page! You wont need to add all those <font> tags any more!  And, the best part is that when you decide your site doesn’t look good with those colors or the chosen layout, all you have to change is the CSS file, as opposed to every HTML page you have created. Voila! Or Viola! Whichever it is, you’re done! Your entire site has a new, better and fresher look.

    More HTML Articles
    More By Christopher Duell


     

    HTML ARTICLES

    - Using a 3D HTML Table as a Recordset
    - Building a 3D HTML Table
    - Maximizing and Restoring HTML Images: Layer ...
    - Completing Construction of a Database Form w...
    - Maximizing and Restoring Images in a Tabular...
    - Building the Recordset for an HTML Database ...
    - Laying Out a Database Form with HTML
    - Tabular Database Form Functions with HTML
    - Tabular Database Forms with HTML
    - Using the Find Functions for HTML Database F...
    - Sorting for Database Forms with HTML
    - Edit and Other Database Form Functions with ...
    - More Database Form Functions with HTML
    - Database Form Functions with HTML
    - Using the HTML Table Element as a Recordset






    © 2003-2008 by Developer Shed. All rights reserved. DS Cluster 1 hosted by Hostway
    Stay green...Green IT