网页样式CSS总结.docxVIP

网页样式CSS总结一、CSS的概念与作用Css全称为级联样式表（Cascading Style Sheet）,通常又称为风格样式表（Style Sheet）,是用来进行网页风格设计的。通过设立样式表，可以统一控制HTML中各标签的显示属性。CSS可以更有效地控制网页外观。使用CSS，可以精确的定位网页元素的位置，美化网页外观。一个合理的CSS，还能有效地节省网络带宽，提高用户体验。同时，使用CSS制作网页，还有以下优点：内容与表现分离。有了CSS，网页的内容（XHTML）与表现就可以分开了。表现统一。可以使网页的表现非常统一，并且容易修改。丰富的样式。使得页面布局更加灵活。减少网页的代码量，增加网页的浏览速度，节省网络带宽。运用独立于页面的CSS，还有利于网页被搜索引擎收录。div标签div标签可以用于定义HTML文档中的分区或节，即可以把HTML文档分割为独立的、不同的部分。div标签就像一个容器，可以放置其他的HTML标签，如段落，列表，图片，表单等。CSS的基本语法结构：style type=“text/css”选择器{属性：属性值;......}/style选择器：表示被修饰的对象，如页面中被修饰的段落标签p、列表标签li等。属性：希望改变的样式，如颜色color、字体大小font—size等，属性和属性值用冒号（：）隔开。例如，设置页面中所有的li标签的文字颜色为红色，字体大小为15px，对应的样式代码如下：style type=“text/css”Li{color:#ff0000;font—size:15px;}/styleCSS选择器：根据选择器表示所修饰的内容类别，选择器又分为标签选择器、类选择器、ID选择器、并集选择器和后代选择器。其中，前3类是CSS的基本选择器，后2类是由多个选择器或标签复合而成的选择器，简称复合选择器。标签选择器当需要对页面内HTML标签的内容进行修饰时，则采用标签选择器。标签选择器的语法：标签名{属性：属性值;.......}例如，设置页面中h1标签中的文本颜色为灰色，字体大小为28px,代码如下所示：h1{Color:#cccccc;font—size:28px;}类选择器使用标签选择器修饰的范围比较广，是针对某一类的表签进行修饰，如果希望设置个别标签的样式，那么就使用类选择器。类选择器的语法：.类名{属性：属性值;.......}类名可以任意选择，应用样式时使用标签的class属性引用类样式，即：标签名 class=“类名”标签内容/标签名ID选择器ID属性是HTML元素的唯一标志，因此要求页面内不能有重复的ID标记属性，W3C以将ID属性定义为HTML元素的标准属性。对应的ID选择器一般用于修饰对应ID标记的HTML元素内容。ID选择器的语法：#ID名称{属性：属性值;.......}并集选择器：并集选择器是多个选择器通过逗号连接而成的，是复合选择器之一。在声明各种CSS选择器时，如果某些选择器的风格是完全相同的，或者部分相同，这时便可以利用并集选择器同时声明风格相同的CSS选择器。并集选择器的语法：标签名,类名，#ID名称{属性：属性值;.......}5、后代选择器后代选择器也是复合选择器中的一种，主要通过嵌套的方式对特殊位置的HTML标签进行声明。后代选择器的写法是把外层的表签写在后面，之间用空格分隔。当标签发生嵌套时，内层的表签就成为外层标签的后代。后代选择器的语法：p span{属性：属性值;........}CSS的继承性：所有的CSS语句都是居于各个标签之间的继承关系的，为了更好的理解继承关系，首先要从HTML文件的组织结构入手。样式优先级：样式的优先级可以分为以下几种：基本选择器之间：ID选择器类选择器标签选择器。样式表之间：行内样式内嵌样式外部样式。CSS样式之间：在同一个选择器中，两条相同的声明，后一条声明会覆盖前一条声明，即显示后一条声明的结果。CSS属性：CSS文字属性：color: #999999; /*文字颜色*/ font-family: 宋体,sans-serif; /*文字字体*/ font-size: 9pt; /*文字大小*/ font-style:itelic;/*文字斜体*/ font-variant:small-caps;/*小字体*/ letter-spacing: 1pt; /*字间距离*/ line-height: 200%; /*设置行高*/ font-weight:bold;/*文字粗体*/ vertical-align:sub;/*下标字*/ vertical-align:super;/*上标字*/ text-decoration:line-through;/*加删除线*/ text-decoration:overline