第05章 样式表.ppt

第五章第五章 样式表样式表 统一网站统一网站(网页网页)风格风格主要内容主要内容一、样式表一、样式表(CSS)的基本概念的基本概念二、利用样式表编辑器编辑样式表二、利用样式表编辑器编辑样式表三、三、CSS属性的理解与应用属性的理解与应用四、四、CSS样式的单位样式的单位五、五、CSS与与HTML文档的结合方法文档的结合方法六、六、CSS的高级应用的高级应用2 2 CSSCSS的使用的使用 一、一、CSS的基本概念的基本概念1、CSS简介简介CSS是是Cascading Style Sheet的缩写，即层叠样式表或级联样式表。的缩写，即层叠样式表或级联样式表。CSS是一种是一种样式表语言样式表语言，用于为，用于为HTML文档文档定义定义有关布局和表现有关布局和表现的的样式样式。CSS的优点的优点内容部分内容部分和和样式部分样式部分各自独立，使数据（内容）处理更简单也更易维各自独立，使数据（内容）处理更简单也更易维护。护。页面代码量减少，可以制作体积更小、下载更快的网页。页面代码量减少，可以制作体积更小、下载更快的网页。语义结构清晰语义结构清晰可以将许多网页同时更新，比以前更快更容易。可以将许多网页同时更新，比以前更快更容易。3 3 CSSCSS的使用的使用 一、一、CSS的基本概念的基本概念2、编写、编写CSS样式的方法样式的方法使用使用CSS编辑器编辑器如如Dreamweaver、Frontpage等都会自带等都会自带CSS编辑器编辑器。使用超文本编辑器使用超文本编辑器如如Dreamweaver、Frontpage等等超文本编辑器超文本编辑器均可编辑均可编辑样式表；样式表；记事本记事本4 4 CSSCSS的使用的使用 一、一、CSS的基本概念的基本概念3、定义、定义CSS样式的基本语法样式的基本语法 P169：包括：包括选择符、属性和值选择符、属性和值选择符选择符属性属性:值值选择符选择符属性属性1:值值1;属性属性2:值值2;单一选择符的复合样式单一选择符的复合样式（包含多个属性）声明（包含多个属性）声明应该用应该用“;”隔开，为隔开，为便于阅读也可以便于阅读也可以分行分行写写。CSS例子例子h1 font-size:x-large;color:redh2 font-size:large;color:blueh1 font-size:x-large;color:redh2 font-size:large;color:blueh1 font-size:x-large;color:redh2 font-size:large;color:blue5 5 CSSCSS的使用的使用 一、一、CSS的基本概念的基本概念注释注释 CSS中中文字的注释文字的注释形式与形式与C语言类似。语言类似。pfont-size:12pt /*p标签的样式定义标签的样式定义*/HTML中的注释：中的注释：6 6 CSSCSS的使用的使用 一、一、CSS的基本概念的基本概念4、选择符的类型、选择符的类型 P175(1)通配选择符（通配选择符（请在书上补充请在书上补充）(2)类选择符类选择符(3)标签选择符标签选择符(4)ID选择符选择符(5)包含选择符包含选择符(6)群组选择符群组选择符7 7 CSSCSS的使用的使用 (1)通配选择符通配选择符写法是写法是“*”，表示所有元素。例如，表示所有元素。例如*font-size:12px;说明：说明：lfont-size属性表示字体的大小，属性表示字体的大小，px是像素是像素l该样式实现的效果：页面中所有文本字体大小为该样式实现的效果：页面中所有文本字体大小为12个像素。个像素。8 8 CSSCSS的使用的使用 (2)类选择符类选择符类选择符类选择符P175用户自己定义的，可以使用任何名称来命名，但用户自己定义的，可以使用任何名称来命名，但必须以必须以“.”开始开始。语法如下：语法如下：.classnameproperty1:value1;property2:value2;.s1font-size:20px;color:red9 9 CSSCSS的使用的使用 类选择符的调用：类选择符的调用：里所有的元素（即各种标记里所有的元素（即各种标记/标签）都可以调用标签）都可以调用“类类”调用时必须利用标签的调用时必须利用标签的class属性属性例如：例如：注意：定义类选择符的时候选择符注意：定义类选择符的时候选择符名称必须以名称必须以“.”开始开始，但在调用的时候不需要但在调用的时候不需要”.”.s1font-size:20px;color:red应用应用s1样式的文字样式的文字1010 CSSCSS的使用的使用 (3)标签选择符标签选择符 P176是指利用是指利用HTML标签作为名称的选择符。标签作为名称的选择符。例如：例如：body、h1、h2、td、ul、li等等注意：标签选择符必须是已有的注意：标签选择符必须是已有的HTML标签，由于标签，由于是重新定义显示的样式，所以它不需要被显式调用，是重新定义显示的样式，所以它不需要被显式调用，网页中的标签就自动会按照重新定义后的网页中的标签就自动会按照重新定义后的HTML标标签进行显示。签进行显示。1111 CSSCSS的使用的使用 (3)标签选择符标签选择符 P176h1 font-size:x-large;color:redh2 font-size:large;color:blue标题标题1的格式的格式标题标题2的格式的格式1212 CSSCSS的使用的使用 (4)ID选择符选择符ID选择符选择符 P179命名和定义与类选择符类似命名和定义与类选择符类似不同之处：不同之处：定义时定义时用用“#”替代替代“.”。ID选择符在一个网页中按照规范选择符在一个网页中按照规范只能调用一次只能调用一次调用时必须利用标签的调用时必须利用标签的id属性属性1313 CSSCSS的使用的使用 （4）ID选择符选择符#box background-color:#CCFF66;border:1px solid#000066;此处显示此处显示 id box 的内容的内容1414 CSSCSS的使用的使用 (5)包含选择符包含选择符P179n在在CSS中，可以定义某样式仅在某个特定范围内才有效。中，可以定义某样式仅在某个特定范围内才有效。（或称为派生选择符）（或称为派生选择符）格式：格式：.s2.s1font-size:12pt;font-family:黑体黑体;color:red选择符选择符1 选择符选择符2property1:value1;property2:value2;S1样式仅在样式仅在s2样式作样式作用范围内会套用上述的用范围内会套用上述的样式设定。样式设定。而在其他而在其他地方不具有这些属性。地方不具有这些属性。例如：例如：1515 CSSCSS的使用的使用 (6)群组选择符群组选择符n把具有把具有相同定义的选择符相同定义的选择符组合在一起，并用逗号隔开，同组合在一起，并用逗号隔开，同时对它们的样式属性进行定义。称为群组选择符时对它们的样式属性进行定义。称为群组选择符例如：定义段落元素例如：定义段落元素p、单元格元素单元格元素td和和类类c1可以使用相可以使用相同样式：同样式：p,td,.c1font-size:12pt;font-family:黑体黑体;color:red1616 CSSCSS的使用的使用 三种常用选择符定义和调用的方法三种常用选择符定义和调用的方法定义方法定义方法调用方法调用方法说明说明 h1(或其他任何存或其他任何存在的标签）在的标签）直接使用原有标签直接使用原有标签重新定义已有标签。重新定义已有标签。#f1选择性调用，原则上一选择性调用，原则上一个文件中只能用一次。个文件中只能用一次。.s1H1.s1选择性调用，推荐。选择性调用，推荐。1717 CSSCSS的使用的使用 伪类（伪类（P187）用于向某些用于向某些选择符选择符添加特殊的效果添加特殊的效果仅在仅在IE5.0以上的浏览器版本才支持伪类。以上的浏览器版本才支持伪类。伪类是伪类是CSS预先定义的预先定义的语法如下：语法如下：selector:pseudo-class property:valuea:link color:#0000001818 CSSCSS的使用的使用 CSS中的伪类中的伪类伪类伪类描述描述:active向被激活的元素添加样式。向被激活的元素添加样式。:focus向拥有键盘输入焦点的元素添加样式。向拥有键盘输入焦点的元素添加样式。:hover当鼠标悬浮在元素上方时，向元素添加样式。当鼠标悬浮在元素上方时，向元素添加样式。:link向未被访问的链接添加样式。向未被访问的链接添加样式。:visited向已被访问的链接添加样式。向已被访问的链接添加样式。:first-child向元素的第一个子元素添加样式。向元素的第一个子元素添加样式。:lang向带有指定向带有指定 lang 属性的元素添加样式。属性的元素添加样式。1919 CSSCSS的使用的使用 a:link color:#000000a:visited color:#cccccca:hover color:#000000;font-style:italica:active color:#aaaaaa:link color:#000000:visited color:#cccccc:hover color:#000000;font-style:italic:active color:#aaaaaa伪类常用于超链接样式的重新定义伪类常用于超链接样式的重新定义定义的顺定义的顺序不能变序不能变！2020 CSSCSS的使用的使用 二、利用样式表编辑器编辑样式表二、利用样式表编辑器编辑样式表1、在网页中创建样式表，分别创建下列三种类型的样式表、在网页中创建样式表，分别创建下列三种类型的样式表标签选择符标签选择符类选择符类选择符ID选择符选择符2、在网页中导入、链入样式表文件、在网页中导入、链入样式表文件2121 CSSCSS的使用的使用 二、利用样式表编辑器编辑样式表二、利用样式表编辑器编辑样式表字体、大小、粗细、行高、字体、大小、粗细、行高、颜色、修饰等颜色、修饰等背景颜色、图像、重复、水背景颜色、图像、重复、水平位置等平位置等字间距、对齐方式、缩进等字间距、对齐方式、缩进等宽、高、填充、边界等宽、高、填充、边界等边框的样式、宽度和颜色等边框的样式、宽度和颜色等设置项目符号和编号。设置项目符号和编号。位置的设置。位置的设置。设置滤镜。设置滤镜。2222 CSSCSS的使用的使用 三、三、CSS属性的理解与应用属性的理解与应用样式表的样式表的7类常用属性：详见类常用属性：详见P170字体属性字体属性：定义文本的字体系列、大小、粗细、风格等。：定义文本的字体系列、大小、粗细、风格等。背景属性背景属性：背景颜色、背景图片等。：背景颜色、背景图片等。文本属性：定义文本的外观。文本属性：定义文本的外观。方框属性方框属性：宽度、高度、边界、填充等：宽度、高度、边界、填充等边框属性：边框粗细、颜色等边框属性：边框粗细、颜色等列表属性列表属性：列表项的类型、缩排等。：列表项的类型、缩排等。鼠标属性鼠标属性：鼠标形状等。：鼠标形状等。2323 CSSCSS的使用的使用 字体属性字体属性font-family:指定文字的字体名称指定文字的字体名称h1font-family:华文彩云华文彩云可以为给定的元素指定一系列类似的字体，然后用逗号进行连接。如：可以为给定的元素指定一系列类似的字体，然后用逗号进行连接。如：h1 font-family:楷体楷体,serif;font-style：指定文字是否使用斜体。取值：指定文字是否使用斜体。取值：normal（正常）、正常）、oblique（偏斜体）、偏斜体）、italic（斜体）斜体）font-size：指定文字的大小。指定文字的大小。font-weight：normal默认值。定义标准的字符。默认值。定义标准的字符。bold定义粗体字符。定义粗体字符。bolder定义更粗的字符。定义更粗的字符。lighter定义更细的字符，定义更细的字符，100、200、300、400、500、600、700、800、900。font：上述样式属性的综合表示法。上述样式属性的综合表示法。pfont:bold 16pt2424 CSSCSS的使用的使用 颜色及背景属性颜色及背景属性color:文本颜色文本颜色background-color：指定背景颜色指定背景颜色 h1background-color:#000800background-image：指定指定html组件的背景图片，值组件的背景图片，值为为url或或none。bodybackground-image:url(image1.jpg)background-repeat background-position 2525 CSSCSS的使用的使用 文本属性文本属性text-decoration：设置底线、顶线、闪烁等文字效果。值设置底线、顶线、闪烁等文字效果。值为为none,underline,overline,line-through,blink.text-align：指定文字的对齐方式。值为：指定文字的对齐方式。值为：left,right,center,justifyline-height：行高行高letter-spacing:字符间距字符间距text-transform：控制文本的大小写控制文本的大小写。值为。值为none,capitalize,uppercase,lowercase2626 CSSCSS的使用的使用 方框属性方框属性width：height：边界边界margin，即围绕在元素边框的空白区域，即围绕在元素边框的空白区域。取值为：取值为：长度长度|百分比百分比|auto上边界：上边界：margin-top；下边界：下边界：margin-bottom左边界：左边界：margin-left：右边界：右边界：margin-right 如：如：p.narrow margin-right:50%填充填充padding，取值为：长度，取值为：长度|百分比百分比|auto上填充：上填充：padding-top；下填充：；下填充：padding-bottom左填充：左填充：padding-left：右填充：右填充：padding-right2727 CSSCSS的使用的使用 边框属性边框属性定义边框：定义边框：border-colorborder-widthborder-style2828 CSSCSS的使用的使用 列表属性列表属性list-style-type：指定项目符号或编号指定项目符号或编号值：值：disc|circle|square|decimal|lower-roman|upper-roman|lower-alpha|upper-alpha|none list-style-image：指定项目符号的图形文件名称，值为指定项目符号的图形文件名称，值为url或或none如：如：LI.square list-style-type:square UL.plain list-style-type:none OL list-style-type:upper-alpha /*A B C D E etc.*/OL OL list-style-type:decimal /*1 2 3 4 5 etc.*/OL OL OL list-style-type:lower-roman /*i ii iii iv v etc.*/2929 CSSCSS的使用的使用 鼠标属性鼠标属性让鼠标移到不同对象上面，显示不同形状。让鼠标移到不同对象上面，显示不同形状。cursor属性，取值如下属性，取值如下auto：自动按默认显示自动按默认显示crosshair：“”hand:手形手形text：文本文本I形形wait：等待等待3030 CSSCSS的使用的使用 四、四、CSS样式的单位样式的单位定义长度大小：定义长度大小：绝对单位：绝对单位：cm,mm,in,pt(印刷点数印刷点数)等。等。将文本设置为指定的大小将文本设置为指定的大小 不允许用户在所有浏览器中改变文本大小（不利于可用性）不允许用户在所有浏览器中改变文本大小（不利于可用性）相对单位：相对单位：em,%,px(像素像素)。相对于周围的元素来设置大小相对于周围的元素来设置大小 允许用户在浏览器改变文本大小允许用户在浏览器改变文本大小 em是指字体高。是指字体高。注意：如果您没有规定字体大小，网页中普通文本（比如段落）的默认注意：如果您没有规定字体大小，网页中普通文本（比如段落）的默认大小是大小是 16 像素像素(16px=1em)。3131 CSSCSS的使用的使用 四、四、CSS样式的单位样式的单位定义颜色定义颜色rgb函数函数：rgb(R,G,B)R、G、B可用百分比值表示，也可用可用百分比值表示，也可用0255的的整数整数值值表示。表示。使用十六进制数组使用十六进制数组：#RRGGBB直接使用颜色名直接使用颜色名。color1:rgb(100%,0,0)color2:rgb(255,0,0)color3:#FF0000color4:red3232 CSSCSS的使用的使用 课堂练习：课堂练习：定义一个样式，使网页中的所有段落显示效果如下：定义一个样式，使网页中的所有段落显示效果如下：字的大小：字的大小：12px字的颜色：字的颜色：0000ff对齐方式为居中对齐方式为居中背景颜色：背景颜色：gray3838 CSSCSS的使用的使用 五、五、CSS与与HTML文档的结合方法文档的结合方法HTML与样式表有多种结合方法与样式表有多种结合方法内嵌样式：在内嵌样式：在HTML标签中利用标签中利用style属性直接加入样式表的定义属性直接加入样式表的定义。内部样式表：内部样式表：在在HTML文件的文件的标记对内定义标记对内定义外部样式表：外部样式表：定义在定义在HTML文件的外部，以另一个文件形式存在，文件扩展文件的外部，以另一个文件形式存在，文件扩展名为名为.css文件不能包含任何的文件不能包含任何的 html 标签标签 HTML文件使用外部样式表，要进行文件使用外部样式表，要进行链接（链接（link）或导入或导入（import）3939 CSSCSS的使用的使用 五、五、CSS与与HTML文档的结合方法文档的结合方法内嵌样式：在内嵌样式：在HTML标签中直接加入样式表的定义标签中直接加入样式表的定义使用标签的使用标签的“style”属性属性来定义样式。来定义样式。由于要将表现和内容混杂在一起，内嵌样式会损失掉由于要将表现和内容混杂在一起，内嵌样式会损失掉样式表的许多优势。样式表的许多优势。若在个别标签需要定义样式，可使用这种方式。若在个别标签需要定义样式，可使用这种方式。被定义的样式文本在此处。被定义的样式文本在此处。4040 CSSCSS的使用的使用 五、五、CSS与与HTML文档的结合方法文档的结合方法内部样式表：在内部样式表：在标记对内定义，仅在本标记对内定义，仅在本网页内起作用。网页内起作用。4141 CSSCSS的使用的使用 五、五、CSS与与HTML文档的结合方法文档的结合方法外部样式表：外部样式表：使用使用标记符标记符链接到外部的样式文件，链接到外部的样式文件，凡链接的网页都起作用凡链接的网页都起作用1、定义外部样式文件，用记事本或者、定义外部样式文件，用记事本或者Dreamweaver，编辑编辑完后保存，文件扩展名应为完后保存，文件扩展名应为”.css”；2、建立建立HTML网页文档；网页文档；3、在网页文档中使用、在网页文档中使用标签将前面的样式表文档链接标签将前面的样式表文档链接到网页中。到网页中。hr.css4242 CSSCSS的使用的使用 五、五、CSS与与HTML文档的结合方法文档的结合方法层叠层叠在一个网页中可以包含：内嵌样式、内部样式表和外部样式在一个网页中可以包含：内嵌样式、内部样式表和外部样式表各若干个。表各若干个。在同一个网页中定义了多个相同名称的在同一个网页中定义了多个相同名称的CSS样式的情况叫层样式的情况叫层叠。叠。发生层叠时，优先级如何呢？发生层叠时，优先级如何呢？一般的，优先级从低到高：一般的，优先级从低到高：浏览器缺省设置、外部样式表、内部样式表（位于浏览器缺省设置、外部样式表、内部样式表（位于 标签内部）、内嵌样式（在标签内部）、内嵌样式（在 HTML 元素内部）元素内部）具体情况还要分析。具体情况还要分析。4444 CSSCSS的使用的使用 五、五、CSS与与HTML文档的结合方法文档的结合方法层叠层叠后定义的属性会覆盖前面定义的属性后定义的属性会覆盖前面定义的属性但如果前面定义的样式中的属性没有被覆盖，网页中实但如果前面定义的样式中的属性没有被覆盖，网页中实际显示样式就会既包括前面定义的没有被覆盖的属性，际显示样式就会既包括前面定义的没有被覆盖的属性，又包括后面定义的样式的属性。又包括后面定义的样式的属性。4545 CSSCSS的使用的使用 六、六、CSS的滤镜属性的滤镜属性（filter）的应用的应用样式表中滤镜的构成样式表中滤镜的构成选择符选择符选择符选择符 FILTERFILTER：滤镜名：滤镜名：滤镜名：滤镜名(属性名属性名属性名属性名1 1属性值属性值属性值属性值1,1,属性名属性名属性名属性名2 2属性值属性值属性值属性值2,);2,);p filter:p filter:glow(colorglow(color=red,strengthred,strength=8);=8);4848 CSSCSS的使用的使用 六、六、CSS的滤镜属性的滤镜属性（filter）的应用的应用静态滤镜的种类（静态滤镜的种类（IE4.0以上版本）以上版本）AlphaAlpha让对象呈现让对象呈现渐变半透明渐变半透明效果效果 BlurBlur 让对象产生风吹模糊的效果让对象产生风吹模糊的效果 DropShadowDropShadow 让对象有一个让对象有一个下落式的阴影下落式的阴影 GlowGlow在对象的周围产生在对象的周围产生光晕而模糊的效果光晕而模糊的效果 4949 CSSCSS的使用的使用 ChromaChroma 让图像中的让图像中的某一颜色变成透明色某一颜色变成透明色 FlipHFlipH让让HTML对象对象水平转换水平转换 FlipVFlipV让让HTML对象对象垂直转换垂直转换 WaveWave让让HTML对象产生水平或是垂直方向上的对象产生水平或是垂直方向上的正弦波形正弦波形 ShadowShadow 让对象产生让对象产生阴影效果阴影效果 MaskMask利用一个利用一个HTML对象在另一个对象上产生图像的对象在另一个对象上产生图像的遮罩遮罩LightLight在在HTML元件上放置一个元件上放置一个光影光影GrayGray把一个彩色的图象变成把一个彩色的图象变成灰色调图象灰色调图象 InvertInvert让对象产生让对象产生照片底片的效果照片底片的效果 XRayXRay让对象让对象轮廓突出显示轮廓突出显示六、六、CSS的滤镜属性的滤镜属性（filter）的应用的应用5050 CSSCSS的使用的使用 （1）光晕字光晕字GlowGlow在对象的周围产生在对象的周围产生光晕而模糊的效果光晕而模糊的效果CSS的滤镜属性制作文字特效的滤镜属性制作文字特效5151 CSSCSS的使用的使用 参数如下：参数如下：COLOR：指定发光的颜色。指定发光的颜色。STRENGTH：发光强度的表现，也指光晕的厚度；其大发光强度的表现，也指光晕的厚度；其大小可以从小可以从1到到255之间之间的任何整数来指定这个强度。的任何整数来指定这个强度。例如：例如：CSS的滤镜属性制作文字特效的滤镜属性制作文字特效p filter:glow(color=red,strength=8);5252 CSSCSS的使用的使用 （2）阴影字）阴影字ShadowShadow让对象产生让对象产生阴影效果阴影效果 CSS的滤镜属性制作文字特效的滤镜属性制作文字特效5353 CSSCSS的使用的使用 参数如下：参数如下：color：设置阴影的颜色。设置阴影的颜色。direction：设置投影的方向，取值范围为度到设置投影的方向，取值范围为度到360度，度，其中其中0度代表垂直向上，然后每度代表垂直向上，然后每45度为一个单位，该属度为一个单位，该属性的默认值是向左的性的默认值是向左的270度。度。例如：例如：CSS的滤镜属性制作文字特效的滤镜属性制作文字特效p filter:shadow(color=#0000ff,direction=180)；5454 CSSCSS的使用的使用 DropShadowDropShadow让对象有一个让对象有一个下落式的阴影下落式的阴影 CSS的滤镜属性制作文字特效的滤镜属性制作文字特效p filter:dropshadow(color=#ff0080,offX=2,offY=2,positive=0)5555 CSSCSS的使用的使用 （3）遮罩字遮罩字 MaskMask利用一个对象在另一个对象上产生图像的利用一个对象在另一个对象上产生图像的遮罩遮罩 作用：该滤镜能够利用一个作用：该滤镜能够利用一个HTML对象在另一个对象上对象在另一个对象上产生图像的遮罩产生图像的遮罩，可以为对象建立一个，可以为对象建立一个覆盖于表面的覆盖于表面的膜膜，其效果就象戴者有色眼镜看物体一样，其效果就象戴者有色眼镜看物体一样，一般适用一般适用于图象对象于图象对象。参数：参数：color属性用来指定要遮罩的颜色。属性用来指定要遮罩的颜色。CSS的滤镜属性制作文字特效的滤镜属性制作文字特效5656 CSSCSS的使用的使用 （4）模糊字）模糊字 BlurBlur让对象产生模糊的效果让对象产生模糊的效果CSS的滤镜属性制作文字特效的滤镜属性制作文字特效p filter:blur(add=1,direction=60,strength=2);5757 CSSCSS的使用的使用 课堂提问课堂提问1）样式表的选择符分成哪几类？）样式表的选择符分成哪几类？2）若要设置水平分割线的样式为居中、红色，则如何定义？）若要设置水平分割线的样式为居中、红色，则如何定义？3）下面定义了一个类）下面定义了一个类mycls，请改错。，请改错。#mycls font-size=12px;color=red;text-align=center;这个类应用到了这个类应用到了P标签中：标签中：4）定义网页中所有的超链接没有下划线，颜色为黑色，背景颜）定义网页中所有的超链接没有下划线，颜色为黑色，背景颜色为色为gray；访问过的超链接没有下划线，颜色为；访问过的超链接没有下划线，颜色为#999900，背景，背景颜色为颜色为gray；鼠标在超链接上方的时候，超链接的颜色为；鼠标在超链接上方的时候，超链接的颜色为#00F，加粗，背景颜色为加粗，背景颜色为#999。5858 CSSCSS的使用的使用 （5）建立样式）建立样式#footer span a:hover，字体颜色为红色，字体颜色为红色，无下划线，行高无下划线，行高150%，加粗，背景颜色为，加粗，背景颜色为#999。（6）综合所学，请举例说明）综合所学，请举例说明CSS有哪些优点。有哪些优点。（7）请简单叙述网页中加入样式表的）请简单叙述网页中加入样式表的3种方法，这种方法，这3种方法种方法各自的适用场合是哪里？各自的适用场合是哪里？5959 CSSCSS的使用的使用