CSS ???

???? CSS ??? ?? ??? ????? ????? ????? CSS? ???? ???? ???? ???. ????? ??? ??? ?? ? ??? ???? ??? ???. CSS ??? ??? ???? ???? ???? ?? ??? ?? ??, ?? ??? ?? ????, ?? ??? ?? ???? ? 4??? ????.

1. ?? ??? ??? ??

?? ??? ??? ???? ?? ??? ??? ??? ?? ??? ???? ????. ?? ?? ???? ?????. ? ????? ??? ????? ? <link> ??? ??? ?? ???? <head>? ???? ???.

<head>

…… <link href="mystyle.css" rel="stylesheet " type="text/css" media="all" >
......
</head>

?? ?? ????? mystyle.css ???? ?? ???? ??? ??? ??? ????. rel="stylesheet"? ????? ? ?? ??? ??? ???? ?? ?????. type="text/css"? ?? ??? ??? ?? ????? ?????. href="mystyle.css"? ??? ?? ?????. ???? ??? ??? ???? ????. ??? ????? ???, ??, ?? ?? ??, ?? ?? ?? ?? ?????.

?? ????? ??? ?? ???? ??? ? ????. ? ????? ??? ???? ?? ???? ???? ?? ?? ?????. ??? ???? ???? ??? ????? ?? ? ?? ?????. ?? ???? ?? ?? ??? ?? ?? ? ??? ???? ?? ? ???? ?? ????? ?????.

??? ?? ??? ??? ???(?: ???)? ???? ?? ??? ? ????. ????? ??? ?? ?? ???? .css???. ???? ??? ??? ???? HTML ??? ???? ????. mystyle.css ??? ???? ??? ????.

hr {color: sienna}

p {margin-left: 20px}

body {Background-image: url("images/back40.gif")} /*?? ???? ??? ?? ??????. ?? ?? ??? 20?????. ???? ?? ???? ??? ????? back40.gif ?????. ??>

2. ?? ??? ??

?? ??? ??? <head> ????? ??? ???? ???? ?????. ??? <style> ??? ???? ?? ??? ??? ? ????.

…… ???: url("images/back40.gif")}
</style>
……
</head>

3. ?? ??? ?? ????
?? ??? ?? ???? ?? ??? ??? ????? < ;style>? ?????. ??? ? @import? ?????. ?? ?? ?????.
<head>

…… <style type="text/css">

</style>
...... .css ?????, ?? ????? ?? ? ?????. ? ??? ??? ??? ???? ??? ?? ????? ?? ??? ??? ???? ?? ??? ? ?? ??? ????. ????? ?? ??? ??? ???? ?? ?????.

??: ?? ??? ?? ????? ?? ?? ??? ???? ?? ??? ?? ?? ??? ??? ???.

4. ??? ???

??? ??? ???. HTML ??? ???? ???? ?? ??? ???? ??? ?? ??? ? ????. ??? ???? ???? ?? ??? ????? HTML ??? ?? ???? ????. ??? ????? ???? ?? ?? ?? CSS ?? ? ????.
<p style="color: sienna;margin-left: 20px;">
?????
</p> <!--? ??? ??? ?????, ?? ??? 20?????. ->
??? ???? ?? ??? ?? ??? ??? ??? ??? ?? ??? ?????.

??: ??? ????? BASEFONT, PARAM ? SCRIPT? ??? BODY(BODY ?? ??)? ?? ??? ??? ? ????.
?? ????? ????

CSS ??? ???? ??? ??? ????. ???? ??? ????? ?? ?? ??? ??? ???? ?? ? ?? ?? ?? ? ?????. ??? ?? ??? ??? ?? ?? ????? ??? ??? ??? ?????. ?? ?? ?? h3 ???? ??, ??? ?? ? ?? ?? ??? ???? ?? ??? ??? ?????.
h3
{
color: red;
text-align: left;
font-size: 8pt;
}
/*?? 3? ??? ??? ??????. ?? ??, ??? ??? 8*/
?? ?? h3 ???? text-align ? ?? ?? ??? ?? ??? ??? ?????.
h3
{
text-align:
?? ??: 20pt; >}
/*?? 3? ???? ????? ?????. ??? 20??????.*/

??? ? ???? ??? ???? ??? ????.
??: ???
??? ??:
?? ??: 20pt; /*??? ??? ????? ??? 20pt???.*/
?? ??? ??? ????. ?? ??? ??, ??? ??? ?? ??? ?? ???? ?? ??? ?? ??? ???? ?????.

??? ??
??? HTML ??? ?? ???? ???? ??? ?? ???? ??? ? ?? ???? ??????
????? ?? ???? ?? ??? ?? ??? ?? ??? ??? ????? ???? 4?? ?? ?? ????? ????.
1. ???? ?? ??
2. ?? ??? ??
3. ?? ??? ??(<head> ?? ??? ??)
4 . ??? ???(HTML ?? ??)
??? ??? ???(HTML ?? ??)? ?? ?? ????? ????. ?, ?? ??? ???? ?????. ?? ??? ???, ?? ??? ?? ?? ????? ??? ??(???)

???? ??

||

??? ??

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> <style> *{ margin:0; padding:0; } body{ background-color:gray; } .clear{ clear:both; } /*head*/ #head{ background-color:blue; height:150px; } /*container*/ #container{ background-color:red; width:360px; height:200px; margin:20px auto; } /*content*/ #content{ background-color:yellow; float:left; width:185px; height:100%; } /*side*/ #side{ background-color:green; float:right; width:255px; height:100%; } /*foot*/ #foot{ background-color:white; height:150px; width:360px; margin:20px auto; } </style> </head> <body>  <div id="head"> </div>   <div id="container">  <div id="content"> </div>   <div id="side"> </div>  </div>  <div class="clear"></div>  <div id="foot"> </div>  </body> </html>

?????? ???
????