Cascading Style Sheets


CSS was introduced to define how to display HTML tags. Without CSS, the browser basically decides how to display common tags such as <P>, <H1>, and <A>, giving the designer little control over the appearance. CSS gives you more control and options over the appearance of your Yahoo! store. CSS is particularly useful for creating rollover effects for text-navigation links. Just as with HTML, you can create CSS by hand in a text editor, but it's easier to use editors such as Dreamweaver for that task. You can use CSS in a Yahoo! store in two ways:

  • Internal style sheet Paste the style sheet information directly into the HEAD-TAGS variable:

    <style type="text/css"> a:link {color: #FF0000} a:visited {color: #00FF00} a:hover {color: #FF00FF} a:active {color: #0000FF} </style> 

    This changes the appearance of every hyperlink in your Yahoo! store that uses the simple <A> tag. Remember to provide a proper opening (<style....>) and closing (</style>) tag.

  • External style sheet Upload your CSS file to your Yahoo! Web Hosting account and link to it as in the previous example:

    <link rel="stylesheet" type="text/css" href="http://site.yourdomain.com/style.css" /> 

The preferred approach to using CSS is to use an external style sheet. After the external style sheet file is loaded into the browser, it is cached for subsequent pages and, hence, reduces page-load times. Also, from an SEO standpoint, the fewer nonvisible page elements there are in the HTML source code, the better. (For this reason, you should also put any JavaScript in an external file.)

Here is a practical example you can use right away: removing the default padding and margin from your page layout (see Figure 7.3).

Figure 7.3. Using CSS to remove padding and margin.


Without having to modify any templates, you can simply add the following instruction to your style sheet:

body {margin:0; padding:0;} 


Naturally, you can also use this to add increase margin and padding.

It is beyond the scope of this book to cover CSS in any great detail. If you are not familiar with style sheets, you should consult the excellent tutorial at www.w3schools.com/css/css_intro.asp, or purchase Sams Teach Yourself CSS in 24 Hours (Pearson Education, 2002).




Succeeding At Your Yahoo! Business
Succeeding At Your Yahoo! Business
ISBN: 0789735342
EAN: 2147483647
Year: N/A
Pages: 208

flylib.com © 2008-2017.
If you may any questions please contact us: flylib@qtcs.net