初探CSS

css基本框架

index.html

 1 <!DOCTYPE html> 2 <html> 3   <head> 4     <meta charset="utf-8" /> 5     <title></title> 6     <!-- 7       描述：外部样式 8           创建一个外部样式表文件，并用link元素引用 9     -->10     <link href="css/easy_css_demo.css" type="text/css" rel="stylesheet"/>11     12     <!--13       描述：文档内嵌样式14           使用style元素，编写一个选择器和一组样式声明15     -->16     <style>17       p{18         background-color: aqua;19       }20     </style>21     22     23   </head>24   <!--25     描述：元素内嵌样式26         用style属性创建元素内嵌样式27   -->28   <body style="background-color: #808080;">29     <p>段落</p>30     <a href="http://www.baidu.com"> 百度</a>31   </body>32 </html>

easy_css_demo.css

 1 /* 2  * 用@import语句，将other_css.css从导入到当前样式表 3  *  （一个样式表中想要导入多少别的样式表都行，为每个样式表使用@import语句即可） 4  *  5  * */ 6 @import "other_css.css"; 7  8 /*css基本框架 9 * css样式  ：10 *  property：value;  11 */12 a{13   text-decoration: none;14 }

CSS属性	描述
background-color	设置元素背景色
border	设置围绕元素的边框
color	设置元素的前景色
margin	设置元素内边距（元素内容与边框之间的距离）
padding	设置元素外边距（元素边框以外的距离）
width	设置元素宽度
height	设置元素高度
font-size	设置元素文字字号
text-decoration	设置元素文字的装饰效果