JavaScript程序设计 教学课件 邹天思 第8章 级联样式表.pdfVIP

 CSS就是一种叫做样式表（style sheet）的技术， 也有人称之为层叠样式表（Cascading Style Sheet）。在主页制作时采用CSS技术，可以有效 地对页面的布局、字体、颜色、背景和其他效果实 现更加精确的控制。只要对相应的代码做一些简单 的修改，就可以改变整个页面的风格。  CSS样式表的特点如下:  将显示格式和文档结构分离  对HTML语言处理样式的最好补充  体积更小加快网页下载速度  实现动态更新、减少工作量  支持CSS的浏览器增多  定义CSS的语句形式如下：     selector {property:value;property:value;…}     SELECTOR ：选择符。  当多个对象具有相同的样式定义时，多个对象之间 可以用逗号分隔  在CSS样式中有3种选择符分别是  HTML选择符  Class选择符  ID选择符  HTML选择符  HTML选择符就是HTML的标记符，例如P、BODY、 A等。如果用CSS定义了他们，那么在整个网页 中，该标识的属性都应用定义中的设置。HTML选 择符的定义方法如下：     tag{property:value}  Class选择符  Class选择符可以分为两种，一种是相关的class selector，它只与一种HTML标记有关系。它的语 法格式如下：     Tag.Classname{property:value}  第二种是独立Class选择符，它可以被任何HTML标 记所应用。  它的语法格式如下：     .Classname{property:value}  ID选择符  ID选择符其实与独立的Class选择符的功能一样， 而他们的区别在于语法和用法不同。它的语法格式 如下：     #IDname{property:value}     ID选择符的用法是在HTML标记中应用ID属性引用 CSS样式  用style标记将样式表嵌入在HTML文件的头部。 style标记的属性type指明样式的类别，除了 CSS样式表外，还有Netscape浏览器使用的JSS （JavaScript Style Sheets ，Java 脚本样式表）样 式表，其样式类别为text/javascript ；type的默认 值为text/css。style标记内定义的前后加上注 释符!--……--的作用是使不支持CSS的浏览器 忽略样式表的定义。嵌入样式表的作用范围是在本 HTML文件内。  如果多个HTML文件要共享样式表，可以将样式表 定义为一个独立的CSS样式文件。HTML文件在头 部用link标记链接到CSS样式文件。  这种方式是在HTML文件的头部style/style 标记之间，用CSS样式表的＠import声明引入外部 样式表。  格式为：     style  @import URL(外部样式文件名);  …  /style     这种方式是在HTML标记中，将定义的样式规则作为标 记style属性的属性值。样式定义的作用范围仅限于此 标记范围之内。一个内嵌样式的应用如下：     body style=font-family:宋体;font- size:12pt;background:yellow     要在一个HTML文件中使用内联样式，必须在该文件的 头部对整个文件进行单独的样式表语言声明，声明如下：     meta http-equiv=Content-Type content=text/css  样式表的作用优先顺序遵循以下原则：  内联样式中所定义样式的优先级最高。  其他样式按其在HTML文件中出现或者被引用的顺 序，遵循就近原则，靠近文本越近的优先级越高。  选择符的作用优先顺序为：上下文选择符、类选择 符、ID选择符，优先级依次降低。  未在任何文件中定义的样式，将遵循浏览器的默认 样式。  内嵌样式是使用style标签属性直接为单个 HTML元素应用的样式表(CSS)指派。而使用 style 对象可以检查这些指派，并进行新的指派或更改已 有的指派。要使用style对象，应该在元素对象上使