第4章编辑css样式,第4章 CSS样式基础

《第4章 CSS样式基础》由会员分享，可在线阅读，更多相关《第4章 CSS样式基础(9页珍藏版)》请在人人文库网上搜索。

1、第4章 CSS样式基础,本章主要讲述了CSS样式的应用方法，现如今网页的排版格式越来越复杂，很多效果需要通过CSS来实现，现代网页制作离不开CSS技术，采用CSS技术可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制，只要对相应的代码做一些简单的编辑，就可以改变同一页面中的不同部分或页数不同页面的外观和格式，用CSS不仅可以做出美观工整令浏览者赏心悦目的网页，还能给网页添加许多神奇的效果。,4.1 CSS概述,CSS是由Cascading Style Sheets缩写来的。是一种对Web文档添加样式的简单机制，是一种表现HTML和XML等文件样式的计算机语言，是一种叫做表样式。

2、的技术。对于设计者来说它是一个非常灵活的工具，不必再把繁杂的样式定义编写在文档结构中，可以将有关文档的样式指定的内容全部脱离出来，在标题中定义、在行内定义，甚至作为外部样式表文件供给HTML页面调用。,4.1.1 CSS的特点 4.1.2 CSS的类型 4.1.3 CSS的基本语法,4.2 CSS样式表的基本用法,要想在XHTML中应用CSS样式，首先要考虑的是选择合适的选择符，选择符是CSS控制XHTML文档中对象的一种方式，用来告诉浏览器这段样式将应用到哪个对象。,4.2.1 如何在HTML内插入样式表 在CSS样式表中，最接近目标的样式定义优先权越高，高优先权样式将继承低优先权样式的未重。

3、叠定义但覆盖重叠的定义。 4.2.2 CSS样式表规则 CSS规则就是所有样式表的基础，每一条规则都是一条单独的语句，它确定应该如何设计样式，以及应该如何应用这些样式。因此，样式表由规则列表组成，浏览器用它来确定页面的显示效果，甚至是声音效果。 CSS由两部分组成：选择符和声明，其中声明由属性和属性值组成，所以简单的CSS规则如下：,4.3 CSS样式表分类,CSS样式表的分类可以分成三种：内联样式(Inline Style)、内部样式表(Internal Style Sheet)和外部样式表(External Style Sheet)。 4.3.1 内联样式 内联样式仅仅是XHTML标签对于。

4、style属性的支持所产生的一种CSS样式表编写方式，并不符合表现与内容分离的设计模式，使用内联样式与表格式布局从代码结构上来说完全相同，仅仅利用了CSS对于元素的精确控制优势，并没能很好的实现表现与内容的分离，所以这种书写方式应当尽量少用。 4.3.2 内部样式表 内部样式表是CSS样式表的初级应用形式，它只针对当前页面有效，不能跨页面执行，因此达不到CSS代码多用的目的，在实际的大型网站开发中，很少会用得到内部样式表。 4.3.3 外部样式表 外部样式表是CSS样式表中较为理想的一种形式。将CSS样式表代码单独编写在一个独立文件之中，由网页进行调用，多个网页可以调用同一个外部样式表文件，因。

5、此能够实用代码的最大化多用及网站文件的最优化配。,4.4 CSS文档结构,CSS通过与XHTML的文档结构相对应的选择器(selector)来达到控制页面表现的目的，而文档结构不仅仅在CSS的应用上非常重要，对于行为层同样也非常重要。,4.4.1 结构 4.4.2 继承 4.4.3 特殊性 4.4.4 层叠 4.4.5 重要性,4.5 单位和值,在CSS选择符中提到过，每一个CSS属性的值均由两种指定形式，一种是指定值范围，如float属性，只可能应用left，right，none三种值，另一种为数值，如width能够使用09999px或其他数学单位来指定，除了px像素单位之外，CSS提供了许。

6、多其他类型的数学单位帮助进行值的定义。,4.5.1 颜色值 4.5.2 定义值 4.5.3 群选择符 4.5.4 派生选择符 4.5.5 id选择符,4.5.6 类选择符 类型选择符(Type Selectors)，以文档语言对象类型作为选择符，即以HTML标签(或叫做标记、tag)作为选择符，class选择符与HTML选择器实现了让同类标签共享同一样式 4.5.7 定义链接的样式表 许多网站使用一个或多个全局样式表，网站上每个页面都与它相链接，使用全局中样式表后，用户改变某个文件，这个文件将影响用户网站上每个页面的外观,4.6 课堂练习,在网页设计中利用CSS样式起到了关键的作用，通过前面的。

7、学习和了解，接下来我们将学到的知识运用到实践中。,4.6.1 设计分析 4.6.2 制作步骤 4.6.3 案例总结,视频位置：光盘视频第4章4-6-1.swf 源文件位置：光盘源文件第4章4-6-1.html,4.7 课堂讨论,本章向读者讲述了CSS样式的就出，那么想知道通过学习本章你对CSS样式基础掌握的如何呢？尝试回答下面的问题吧。 4.7.1 问题1 CSS能做什么 CSS样式表可以用来改变从文本样式到页面布局的一切，并且能够与JavaScript结合产生动态显示效果。文本格式和颜色、图形外观和布局、绘制页面各部分的边框和动态操作。 4.7.2 问题2CSS和HTML区别 超文本标记语言。

8、(HTML，Hypertext Markup Language)由标记文档内特定元素的一系列标签组成。这些元素都具有默认表示样式。默认表示样式由浏览器提供，基于HTML的正式规范。用户通过链接到样式表，甚至通过在HTML文件内包括样式表，可以对HTML页面应用样式表，这样可以重新定义每个元素的表示样式。 HTML页面可以包含设置表达样式的属性和标签，但是与CSS比较，它们的功能和效果有限。样式表可以与HTML表达标记一起使用，例如标签或者color=”red”属性，或者可以完全替换表达标记和属性。,4.8 课后练习,制作设计工作室网页 通过本章那个的学习读者已经初步掌握了CSS样式的基础，下面通过课后的练习对知识进行巩固加深记忆。,源文件地址：光盘 素材第4章4-8.html 视频地址：光盘 视频第4章4-8.swf。