CSS样式表15331

,单击此处编辑母版标题样式,*,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,CSS,样式表,什么是层叠样式表,CSS,即,Cascading Style Sheet(,级联样式单,),的缩写,通过设立样式表，我们可以统一地控制,HMTL,中各标志的显示属性,通过动态地改变页面元素的,CSS,属性，动态改变样式。,如何建立样式表,样式表的建立要符合,CSS,规则，,语法如下：,HTML,标志,标志属性,:,属性值,；,标志属性,:,属性,；,.,Pbackground-color:#0000ff；font-size:12pt；color:#ffff00,将层叠样式单放在何处,有三种方式：,外部文件方式；,内部文档头方式；,直接插入式,外部文件方式,将,CSS,写成一个文件，在,HTML,文档头通过文件引用来进行风格控制,CSS,文件的撰写,myStyle.css,Pfont-family:,宋体,font-size:9pt;,color:blueH2font-family:,宋体,font-size:13pt;,color:red,在,HTML,的,标志之间写下列语句：,CSS,文件的引用,CSS,样式文件,-,外部样式表,这里是,P,标记的新样式,这里是,H2,标记的新样式,Pfont-family:,宋体,;font-size:13pt;color:blue,H2font-family:,宋体,;font-size:20pt;color:red,myStyle.css,内部文档头方式,将风格直接定义在文档头,之间，,这里是,P,标记的新样式,这里是,H2,标记的新样式,直接插入式,在每个,HTML,标志后直接书写,CSS,属性。,这里是,P,标记的新样式,这里是,H2,标记的新样式,用第一种方式,:,统一整个站点风格,用第二种方式；页内风格统一,用第三种方式：页内某个标志的具体微调,前两种的目的在于,一、统一风格,二、减少繁琐的标志属性设置,小结,三种样式优先权：,直接插入式,内部文档头方式,外部文件方式,创建并引用样式类,使用样式类的目的,对样式进行分类，从而可以根据不同的风格需要对某一类型的标志设置几种不同的,CSS,属性，也可以对整个风格分成几个类而不是只针对某一种类型的标志,样式类的建立,可以在外部文件与文档头方式中建立，而不能在直接插入式中建立,Pfont-family:,宋体,；,font-size:10pt,；,font-color,；,Red,P.,isLefttext-align:left,P.,isRighttext-align:right,P.,isCentertext-align:center,两种方法：,第一种：,标志,.,样式类,1,属性,1:,值,1;,属性,2:,值,2; ,标志,.,样式类,2,属性,1:,值,1;,属性,2:,值,2; ,第二种：,.,样式类名属性,1:,值,1;,属性,2:,值,2; ,.,isLefttext-align:left,.,isRighttext-align:right,.,isCentertext-align:center,它规定的样式类，没有特定于某一类标志，而是其它类型的标志都可以用,样式类的引用,你好，欢迎你,动态改变某个引用了样式类的标志风格,通过脚本语言来修改标志对象的,className,属性,所要修改标志的标识号,.,style.className,=,样式类名,如对一标志,hello,修改为右排列的样式，在脚本语言中修改语句如下,p1.style.className=,isRight,h1,h2,h3vertical-align:top,p.s1color:red,P.s2color:blue,.allfont-size:18pt;color:green,一号标题,二号标题,P,的,S1,标记,P,的,S2,标记,自定义标记,在,DreamWeaver,的,Window,菜单下的,styles,选项创建,在,FrontPage Editor98,中,Format,菜单下,StyleSheet,菜 单项来创建，,如果你熟悉,CSS,属性，可直接在记事本里写，最后的文件扩展名为,CSS,。,