使用CSS创建网页

使用CSS创建网页本章内容11.1初识CSS11.2CSS语法基础11.3定义CSS样式的属性11.4编辑CSS样式11.5CSS过滤器11.6综合应用：网页中链接样式的设定11.1初识CSS11.1.1CSS概述11.1.2CSS的作用11.1.1CSS概述CSS是CascadingStyleSheet的缩写，也被称做层叠样式表或级联样式表，是用来控制文档中某一区域外观的一组格式属性。11.1.2CSS的作用1.分离了格式和结构2.控制页面布局3.制作出更小、下载更快的网页4.便于维护及更新大量的网页5.使浏览器成为更友好的界面11.2CSS语法基础11.2.1基本CSS语法11.2.2创建CLASS11.2.3使用ID11.2.1基本CSS语法CSS由标签和属性构成，基本语法如下：HTML标签{属性1:属性值;属性2:属性值;属性3:属性值;……}11.2.2创建CLASS利用CLASS可以创建同一个HTML标签的多种风格，其语法为：标签.类名{属性1:属性值;属性2:属性值;属性3:属性值;……}引用方法为：<标签CLASS="类名">11.2.3使用ID#id名{属性1:属性值;属性2:属性值;属性3:属性值;……}11.3定义CSS样式的属性11.3.1文本样式的定义11.3.2背景样式的定义11.3.3区块样式的定义11.3.4方框样式的定义11.3.5边框样式的定义11.3.6列表样式的定义11.3.7定位样式的定义11.3.8扩展样式的定义11.3.9创建嵌入式CSS样式11.3.10链接外部样式表11.3.11综合应用：定义网页样式和边框11.3.1文本样式的定义11.3.2背景样式的定义11.3.3区块样式的定义11.3.4方框样式的定义11.3.5边框样式的定义11.3.6列表样式的定义11.3.7定位样式的定义11.3.8扩展样式的定义11.3.9创建嵌入式CSS样式

嵌入式CSS样式是一系列包含在HTML文档文件头部分的style标签内的CSS规则。11.3.10链接外部样式表Dreamweaver提供有链接外部CSS样式的功能，通过该功能可以将其他页面中的样式应用到当前页面中。11.3.11综合应用：定义网页样式和边框11.4编辑CSS样式11.4.1修改CSS样式11.4.2删除CSS样式11.4.3复制CSS样式11.4.1修改CSS样式在【CSS样式】面板中可以修改CSS样式。11.4.2删除CSS样式对于不需要的CSS样式可以将其删除。11.4.3复制CSS样式选择右键菜单命令可以复制CSS样式。11.5CSS过滤器11.5.1CSS滤镜概述11.5.2通道（Alpha）滤镜11.5.3模糊（Blur）滤镜11.5.4透明色（Chroma）滤镜11.5.5下落的阴影（DropShadow）滤镜11.5.6水平翻转（FlipH）滤镜和垂直翻转（FlipV）滤镜11.5.7光晕（Glow）滤镜11.5.8灰色（Gray）滤镜11.5.9反色（Invert）滤镜11.5.10遮罩（Mask）滤镜11.5.11阴影（Shadow）滤镜11.5.12波浪（Wave）滤镜11.5.13X射线（X-ray）滤镜11.5.1CSS滤镜概述CSS滤镜属性的标识符是filter。与前面介绍的属性定义方法类似，它的书写格式为：filter：filtername（parameters）11.5.2通道（Alpha）滤镜使用Alpha属性可以设置透明度。11.5.3模糊（Blur）滤镜使用Blur属性可以建立模糊的效果。11.5.4透明色（Chroma）滤镜应用Chroma属性可以把指定的颜色设置为透明效果。11.5.5下落的阴影（DropShadow）滤镜应用DropShadow属性建立一种偏移的影像轮廓（即投射阴影）。11.5.6水平翻转（FlipH）滤镜和垂直翻转（FlipV）滤镜应用FlipH属性和FlipV属性完成图像的水平和垂直翻转。11.5.7光晕（Glow）滤镜应用Glow属性为对象的外边界增加光效。11.5.8灰色（Gray）滤镜应用Gray属性降低图片的彩色度。11.5.9反色（Invert）滤镜应用Invert属性将色彩、饱和度以及亮度等值完全翻转建立底片效果。11.5.10遮罩（Mask）滤镜应用Mask属