How to CSS?
How to CSS? Learning how to use CSS in your websites is one of the best things you can do to build a better website. CSS is a powerful styling language used to format and style a website’s look and feel. It has capabilities beyond in-line HTML formatting and is much more flexible.
CSS allows you to separate the content of your website from the way you present it. Colors, font sizes, layout details can be inserted into an external document called a stylesheet. This contains the CSS code which formats your html documents.
Making formatting changes to your webpages becomes much more maintainable. You only need to modify a stylesheet, which is one file versus all of your html files. As a site grows and you increase the number of html pages this separation becomes crucial in maintainability.
So how to CSS? How do we separate formatting and styling exactly. Let’s look at some examples.
Let’s say that the title of your pages are all within an <h1> tag. And you want a specific font size, color, bold etc for that heading or <h1> tag. So your HTML code looks like the code below.
<h1><font size=2 color=blue><b>This is the title of my page.</b></font></h1>
This is the title of my page.
So the above is my h1 look. Now this is the title on all of my HTML pages. Now lets’ say you have 50 pages on your site with the above code and you want to modify the color on your page titles. You have to now go modify and re-upload 50 pages.
The better way is strip out the style and put it into an external stylesheet. For example the above code would look like this with the styling stripped out.
<h1>This is the title of my page.</h1>
Then you create a stlye.css file which contains the code to style the above h1 tag like this. You’ll have to include the file into the html page. To do this you’ll add a line of code between your <head></head> tags in your HTML files.
<link href="style.css" rel="stylesheet" type="text/css" />
h1 {
font-size=28px;
color=blue;
font-weight: bold;
}
So now when you want to change this across multiple pages you modify just one file and it takes effect across all of you HTML pages.
If you have alot of styling in your HTML files, take the time to strip it out and create a stylesheet instead. It will be worth your time in the long run. It’s good to learn some basic CSS before you start and then use it and learn as you go. The more you use it the more you’ll learn.
how to CSS