miminari Сообщение 08/06/2011 14:16 Копия темы
Methods of adding CSS to HTML There are several ways to add CSS to the HTML document. Theoretically, you can use them all. Practically, it is necessary to avoid some of them.

Inline CSS

You can use this method when you're just starting to develop HTML / CSS. If you are a real coding ninja – do not do it! Be wise, separate content from design.

<h1 style="color: black; background: grey">I'm Black Heading with the Grey Background

Embedding CSS into HTML

Stylesheet can be embedded into the <head> of HTML document with the <style> tag.


<head>
<style type="text/css">
.rule_one
.rule_two
.rule_three
...
</style>
</head>

Notes:
Should I use this method? – Yes, if you use just a few lines of code, specific for the current page.
Will it work within the <body> element? – Yes. Would that be right? – No! First of all this is a misstep, as well as no separation of content from design.

Linking to a separate CSS file

This is a base way to add stylesheets to your HTML. Style rules are contained in a single text file with the *.css extension, wich plugs to the every page.


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

Notes:
Will it work within the <body> element? – Yes. Would that be right? – As in the previous – No!
The media attribute is optional, and allow you to specify how documents will be presented in different media.

Import CSS file into another

The @import rule allows you to load a CSS file from another one.

/* Import CSS file into another */
@import "style.css";
@import "print.css" print;

Notes:
@import is not permitted to insert after any CSS rule, except @charset or another @import.
IE 7< does not support media types when you import the style file.