Definitive Guide to CSS
Definitive Guide to CSS - CSS stands for Cascading Style Sheets. CSS directs the web browser to display content by the rules that have been set up in a css file by using the html elements or in some cases by embedded cascading styles.
It’s easier to apply your cascading style in a css file because it make’s it much easier to manage your website’s look and feel. You really have no limits to applying css to your website which includes the ability to add css to your Tables and content.
Lets take a look at an example.
I have 2 Headings. One is a H1 heading and the other is a H2
heading. I would like to change the text to orange for the H1
heading and Green to the H2 heading so they look like the
following.
H1 Heading
H2 Heading
To create both above it’s a matter of just adding the following:
<html>
<head>
<title>Definitive Guide to CSS - CSS stands for Cascading Style Sheets.</title>
<meta name=”generator” content=”Namo WebEditor v6.0″>
<style Type=”text/css”>
<!–
h1 { font-size: x-large; color: orange }
h2 { font-size: large; color: green }
–>
</style>
</head>
With this example anytime I use either a H1 or H2 element in my
webpage’s the colors and formatting change depending on the style
that has been setup and this is done by the web browser converting
H1 and H2 elements to the desired output. It make’s it really easy
to use an design and create your own css and apply all the formatting to each
one.
Why use css? By using css you’re able to manage the look and feel
of your website just by changing one css file.
Using the ID Attribute
The ID attribute is a handy attribute to use because you can apply
this css formatting to practically any part of your website just by
applying the style to the ID attribute and then applying it to your
content.
Let’s take a look at an example at the ID Attribute of the Definitive
Guide to CSS.
Lets say I want to have this sentence in the color blue.
I can do this two ways.
I can apply a color format to the sentence but if I need to apply this
style throughout my webpages in particular sentence it’s easier to
manage and change the content using a CSS ID Attribute.
The following code is what I have used to create the above format
which is highlighted in bold:
<html>
<head>
<title>Definitive Guide to CSS - CSS stands for Cascading Style Sheets.</title>
<meta name=”generator” content=”Namo WebEditor v6.0″>
<style Type=”text/css”>
<!–
#Blue { color:rgb(0,102,204); }
–>
</style>
</head>
For the text to change color I applied the following code to my text:
<p ID=Blue>Lets say I want to have this sentence in the color blue.</p>
The name of the Id Attribute I used is Blue and you can use whatever
name you like it starts with # in the style type area.
Its highly advisable that you create an external css file and link your
webpages to it so that way you can easily make changes throughout
your website just by changing one file.
When designing your next style sheet think about if you need to use the ID Attribute in for parts for your content
Tags: Definitive Guide to CSS
