（十）使用css样式的方式

一.使用css样式的方式

1.内链样式表

 格式：

<body style=" margin:0; padding：0">
使用css样式
</body>

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4     <meta charset="utf-8">
 5     <title>使用css样式</title>
 6     </head>
 7     <body style="background-color:red; margin:0; padding：0">//margin是外边距 padding是内边距
 8     使用css样式
 9     <br/>
10     使用css样式
11     </body>
12 </html>
View Code

2.嵌入式样式表

格式：

<head>

body{
background-color:red;
color:green;
}

</head>

注意：需要将样式放在<head></head>中

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4     <meta charset="utf-8">
 5     <title>使用css样式</title>
 6     <style type="text/css">
 7     body{
 8     background-color:red;
 9     color:green;
10     }
11     p{
12     background-color:green;
13     color:red;
14     }
15     </style>
16     </head>
17     <body >
18     使用css样式
19     <br/>
20     <p>使用css样式</p>
21     </body>
22 </html>
View Code

3.引入式样式表

格式：

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

demo.html

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4     <meta charset="utf-8">
 5     <title>使用css样式</title>
 6     <link rel="stylesheet" type="text/css" href="style.css"></link>
 7     </head>
 8     <body >
 9     使用css样式
10     <br/>
11     <p>使用css样式</p>
12     </body>
13 </html>
View Code 

style.css

1 body{
2     background-color:red;
3     color:green;
4 }
View Code

 

posted @ 2015-12-23 09:57  花花妹子。  阅读(172)  评论(0)    收藏  举报