Tutorials for webmasters, graphic design learners, freelancers make more moeny...
An Introduction to CASCADING STYLE SHEETS
Adobe Illustrator is an important vector-based drawing tool that will help you create logos, shapes and illustrations in no time. Vector-based means that you can adjust the size of the image without worrying about image quality, unlike in Raster-based programs such as Photoshop. Here are tips that will help you become an Adobe Illustrator master in no time at all:
 
CSS is the acronym for: ‘Cascading Style Sheets’. CSS is an extension to basic HTML that allows you to style your web pages.

An example of a style change would be to make words bold. In standard HTML you would use the <b> tag like so:

 
<b>make me bold</b>
 
This works fine, and there is nothing wrong with it per se except that now if you wanted to say change all you text that you initially made bold to underlined, you would have to go to every spot in the page and change the tag.

Another disadvantage can be found in this example: say you wanted to make the above text bold, make the font style Verdanna and change its color to red, you would need a lot of code wrapped around the text:

 
<font color="#FF0000" face="Verdana, Arial, Helvetica, sans-serif"><strong>your text here</strong></font>
 
This is verbose and contributes to making you HTML messy. With CSS, you can create a custom style elsewhere and set all its properties, give it a unique name and then ‘tag’ your HTML to apply these stylistic properties:
 
<p class="myNewStyle">My CSS styled text</p>
 
And in between the <head></head> tags at the top of your web page you would insert this CSS code that defines the style we just applied:
 
<style type="text/css">
<!--
.myNewStyle {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-weight: bold;
color: #FF0000;
}
-->
</style>
 
In the above example we include the style sheet code inline, or in other words, in the page itself. This is fine for smaller projects or in situations where the styles you’re defining will only be used in a single page. There are many times when you will be applying your styles to many pages and it would be a hassle to have to copy and paste your CSS code into each page.

Besides the fact that you will be cluttering up your pages with the same CSS code, you also find yourself having to edit each of these pages if you want to make a style change. Like with JavaScript, you can define/create your CSS styles in a separate file and then link it to the page you want to apply the code to:

 
<link href="myFirstStyleSheet.css" rel="stylesheet" type="text/css">
 
The above line of code links your external style sheet called ‘myFirstStyleSheet.css’ to the HTML document. You place this code in between the <head> </head> tags in your web page.
 
How to Creat a linked EXTERNAL STYLE SHEET ?
 
Best Sites
 
 



Need a Designer? Contact me
add url   web resource   advertise

©2005 Learner Tutorials. All rights reserved.