文档介绍：第3章层叠样式单CSS
信息科技学院
学习要点:
。
。
、颜色和背景属性、文本属性、边框属性等。
。
。
第3章 HTML基础与层叠样式单CSS
层叠样式单CSS
层叠样式单CSS
CSS的特点
CSS的定义
CSS中的选择符
CSS的使用方式
用CSS控制Web页元素的显示外观
CSS应用实例
层叠样式单CSS
初步了解CSS
CSS(Cascading Style Sheets,层叠样式单)是W3C协会为弥补
HTML在显示属性设定上的不足而制定的一套扩展样式标准。早在1996年W3C便提出了一个定义CSS的草案,很快这个草案就成为一个被广泛采纳的标准。到1998年,W3C在原有草案的基础上进行了扩展,建立了CSS2规范,它不仅包括了原有的表现形式标准,还有许多增强功能。
CSS重新定义了HTML中原来的文字显示样式,并增加了一些新概
念,如:类、层等,还可以处理文字重叠、定位等,它提供了更丰富的
样式。同时CSS可集中进行样式管理。允许将样式定义单独存储于样式
文件中,把显示的内容和样式定义分离,便于多个HTML文件共享。一
个HTML文件也可以应用多个CSS样式文件。
CSS是一种制作网页的新技术,现在已经成为网页设计必不可少的工具之一。
可惜的是,到目前为止,还没有任何一个浏览器能完全遵从CSS2标准,也就是
CSS2定义的某些标记在某些浏览器上可能不起任何作用。
CSS的特点
使用CSS可以很方便地管理显示格式方面的工作,首先它能够为网页上的元素精确地定位,让网页设计者自由控制文字、图片在网页上按要求显示。其次它能够实现把网页上的内容结构和格式控制相分离。浏览者想要看的是网页上的内容结构,而为了让浏览者更好地看到这些信息,就要通过格式控制来帮忙了。以前两者在使用传统HTML语言设计的网页上的分布是交错结合的,查看修改很不方便,而现在把两者分开就会大大方便网页的设计者。内容结构和格式控制相分离,使得网页可以仅由内容构成,而将所有网页的格式控制指向某个CSS样式表文件。
使用CSS带来两个方面的好处:
(1)简化了网页的格式代码,外部的样式表还会被浏览器保存在缓存里,加快了下载显示的速度,也减少了需要上传的代码数量(因为重复设置的格式将被只保存一次)。
(2)只要修改保存着网站格式的CSS样式表文件就可以改变整个站点的风格特色,在修改页面数量庞大的站点时,显得格外有用。避免了一个一个网页的修改,大大减少了重复劳动的工作量。
CSS的定义
CSS是一种格式化网页的标准方法,它就颜色、字体、间隔、定位以及边距等格式提供了几十种属性,这些属性可通过style应用于在HTML标记中。
一个样式表是由许多样式规则组成的,用来控制网页元素的显示方式,其规则的形式为: 选择符{属性1:值1;属性2:值2;……} 
规则由选择符以及紧跟其后的一系列“属性:值”对组成,所有“属性:值”对用“{}”包括,各“属性:值”对之间用分号“;”分隔。选择符是指要引用样式的对象,可以是一个或多个HTML标记(各标记之间用逗号分开),也可以是类选择符()、id选择符或上下文选择符。样式定义中还可以加入注释来说明代码的意思,注释有利于自己或别人以后编辑和更改代码时理解代码的含义。
CSS定义范例
CSS中的选择符
CSS中有六种选择符,分别是HTML标记、具有上下文关系的HTML标记、用户自定义类选择符、用户定义的ID选择符、虚类、虚元素。分别说明如下:
HTML标记类选择符
直接用HTML标记或HTML元素名称作为CSS选择符,例如:
td,input,select,body {font-family:Verdana;font-size:12px;}
form,body {margin:0;padding:0;}
select,body,textarea {background:#fff;font-size:12px;}
select {font-size:13px;}
textarea {width:540px;border:1px solid #718da6;}
img {border:none}
a {text-decoration:underline;cursor:pointer;}
h1 {color: #ff0000}