网页制作综合技术教程（第2版）.pptVIP

CSS提供了两种确定表格以及内部单元格宽度的方式，一种与表格内部的内容相关，称为“自动方式”；一种与内容无关，称为“固定方式”。12.1.2确定表格的宽度除了前面介绍的标记之外，前面的章节还介绍过HTML中还有3个标记thead、tbody和tfoot，它们用来定义表格的不同部分，称为“行组”。12.1.3其他与表格相关的标记表格的HTML结构示意本案例对一个简单的表格进行设置，使它看起来更为精致。另外，当表格的行和列都很多，并且数据量很大的时候，为避免单元格采用相同的背景色会使浏览者感到凌乱，发生看错行的情况，可以为表格设置隔行变色的效果，使得奇数行和偶数行的背景颜色不一样。12.2美化表格交替变色的表格样式首先确定表格的HTML结构。12.2.1搭建HTML结构没有设置任何样式的表格对表格的整体和标题进行设置。12.2.2整体设置设置部分属性的表格样式现在来设置各单元格的样式。首先分别设置tbody和thead、tfoot部分的行背景色。12.2.3设置单元格样式设置了单元格的样式10.3用CSS设置背景样式在HTML部分中已经对如何设置网页的背景颜色以及如何把图片设置为网页的背景做了详细的介绍，本节主要介绍颜色的多种设置方法，网页和文字背景颜色的设置方法，以及多种背景图片样式的设置方法。通过对本章的学习，读者可以更加灵活地进行网页和网页元素的背景设置。10.3.1设置背景颜色设置标题“蓝底白字”效果在HTML中，设置网页的背景颜色是利用body标记中的bgcolor属性，而在CSS中不但可以设置网页的背景颜色，还可以设置文字的背景颜色。在CSS中，网页元素的背景颜色是利用background-color属性来设置，属性值为某种颜色。颜色值的表示方法和前面介绍的文字颜色设置方法相同。网页的初始效果10.3.2设置背景图像页面的body元素设置了背景图像后的效果设置背景图像时使用background-image属性实现。背景图像10.3.3设置背景图像平铺在默认情况下，图像会自动向水平和竖直两个方向平铺。如果不希望平铺，或者只希望沿着一个方向平铺，可以使用background-repeat属性来控制。该属性可以设置为以下4种值之一。repeat：沿水平和竖直两个方向平铺，这也是默认值。no-repeat：不平铺，即只显示一次。repeat-x：只沿水平方向平铺。repeat-y：只沿竖直方向平铺。同时设置背景图像和背景颜色水平方向平铺背景图像的效果设置背景颜色后的效果渐变色构成的背景图像10.3.4设置背景图像位置用百分比设置背景图像的位置在background-position属性中，设置如下两个值。（1）第1个值用于设定水平方向的位置，可以选择“left”（左）、“center”（中）或“right”（右）之一。（2）第2个值用于设定竖直方向的位置，可以选择“top”（上）、“center”（中）或“bottom”（下）之一。用数值设置背景图像的位置10.3.5固定背景图片位置将背景图像固定在浏览器窗口中通过CSS的background-attachment属性可以把背景图像设置成固定不变的效果，而不跟随网页内容一起滚动。背景图像随页面一起移动10.3.6设置标题的图像替换图像替换的最终效果如果标题文字应用特效而无法表现时，可以使用图像的方法替换。文字标题效果制作一个标题背景图像第11章用CSS设置链接与导航菜单本章简介：在一个网站中，所有页面都会通过超链接相互链接在一起，这样才会形成一个有机的整体。在各种网站中，导航都是网页中最重要的组成部分之一，因此，也出现了各式各样非常美观、实用性很强的导航样式。丰富的超链接特效11.1控制鼠标指针11.2设置项目列表样式11.3创建简单的导航菜单11.4应用滑动门技术的玻璃效果菜单11.5超链接是网页上最普通的元素，通过超链接能够实现页面的跳转、功能的激活等，因此超链接也是与用户打交道最多的元素之一。本节主要介绍超链接的各种效果，包括超链接的各种状态、伪属性和按钮特效等。11.1丰富的超链接特效普通的超链接没有下划线的超链接在浏览网页时，通常看到的鼠标指针的形状有箭头、手形和I字形，而在Windows环境下实际看到的鼠标指针种类要比这个多得多。CSS弥补了HTML在这方面的不足，通过cursor属性可以设置各式各样的鼠标指针样式。11.2控制鼠标指针传统的HTML提供了项目列表的基本功能，包括顺序式列表的ol标记和无顺序列表的ul标记等。当引入CSS后，项目列表