CSS之基础篇

                                 css基础

1:缩写方法:p{ color : #ff0000}===> p {color : #foo}。

2:两种方法实现rgb p{color : rgb(255,0,0);}==>p{color: rgb(100%,0%,0%)}

3:若干单词需要加引号 p{font-family: "snas serif"}

4:每行结束加分号。   p {

  text-align: center;

  color: black;

  font-family: arial;

}

5:单独css对大小写不敏感,但是和html一起工作涉及class和id名称大小是敏感的。

6:选择器分组:h1,h2,h3,h4,h5,h6{ color: green; } 同时命名标题都是一种颜色。

7:id 选择器id 选择器以 "#" 来定义。

#red{color:red;}

#green{color:green;}

html中

这个段落是红色。

8:CSS 类选择器   .center{text-align: center}

html中

         This heading will be center-aligned

         

和 id 一样,class 也可被用作派生选择器:.fancy td{color: #f60;background: #666;}

元素也可以基于它们的类而被选择:td.fancy{color: #f60;background: #666;}

9:CSS 属性选择器-对带有指定属性的 HTML 元素设置样式。

10:外部样式表   浏览器会从文件 mystyle.css 中读到样式声明,并根据它来格式文档。

内部样式表 

hr {color: sienna;} p {margin-left: 20px;} body {background-image: url("images/back40.gif");}hr {color: sienna;} p {margin-left: 20px;} body {background-image: url("images/back40.gif");}

内联样式

This is a paragraph

11:即颜色属性将被继承于外部样式表,而文字排列(text-alignment)和字体尺寸(font-size)会被内部样式表中的规则取代。以内部样式为主。

hr {color: sienna;} p {margin-left: 20px;} body {background-image: url("images/back40.gif");}

你可能感兴趣的:(CSS之基础篇)