HTML使用标签将内容放到网页上,也可使用元素和属性来控制简单的文档外观.如果希望更全面地控制Web页面的外观和布局,则需要使用层叠样式表(简写为CSS).CSS规范的工作原理在于允许用户制定一些规则,描述文档中元素内容的表现形式,通过设置不同的规则控制页面中每一个元素的外观,包括字体的颜色和大小.线的宽度和颜色.页面中各项之间的空白量,以便使页面看上去更令人感兴趣.CSS和HTML一样是所有网页制作技术的核心与基础,是为HTML制定样式的机制,能控制浏览器如何显示HTML中的每个元素及其内容.…

4  结构性伪类选择器 在学习结构性伪类选择器之前,先了解两个概念:伪类选择器和伪元素选择器.伪类选择器是CSS中已经定义好的选择器,不能随便命名.常用的伪类选择器是使用在a元素上的几种,如a:link.a:visited.a:hover.a:active.而伪元素选择器并不是针对真正的元素使用的选择器,而是针对CSS中已经定义好的伪元素使用的选择器,CSS中有4种伪元素选择器,即first-line.first-letter.before.after.例如,p:first-line{color…

要使用CSS对HTML页面中的元素实现一对一.一对多或者多对一的控制,就需要用到CSS选择器.选择器是CSS3中一个重要的内容,使用它可以大幅度地提高开发人员书写或修改样式表的效率.在大型网站中,样式表中的代码可能会达到几千行,而当我们需要对样式进行修改时,并没有说明什么样式服务于什么元素,只是在元素中使用了class属性.而class属性本身没有语义,它纯粹是用来为CSS服务的,属于多余属性.CSS3提倡使用选择器来将样式与元素直接绑定起来,这样一来,在样式中什么样式与什么元素相匹配就变得一目…

CSS和HTML一样都是由W3C制定的标准,本章中介绍的特性和功能还是来源于CSS1和CSS2(CSS2是根据CSS1扩展的).W3C也有新的版本更新,称为CSS3.虽然浏览器已经准备开始实现CSS3某些方面的内容,但当前浏览器仍然无法支持某些特性.一张样式表由样式规则组成,以告诉浏览器怎样去呈现一个文档.如图6.2所示给出了关于CSS规则的一个示例. 图6.2  CSS规则组成 CSS的规则主要由“选择器”和“声明”两部分组成,选择器指定声明应用于哪个或哪些元素(后面有详细讲解).例如,任何H…

CSS综合实例 在Web页面中经常使用栏目显示分类内容.本例将使用HTML和CSS结合编写一个分类栏目模型,用于演示前面介绍的CSS应用.通过使用独立的文件定义样式表,并在HTML文档中使用link标记与其链接,使HTML代码和CSS代码完全分离.在HTML文档中只负责输出栏目的内容,而栏目的样式则完全由CSS控制.创建一个名为list.html的HTML文档文件,代码如下所示: 在上面的HTML文件中输出一个分类栏目,包括栏目标题.栏目内容区块及内容列表等.但没有定义栏目的显示格式,而是链接一…

6  鼠标光标属性 在网页中默认的鼠标指针只有两种,一种是最普通的箭头,另一种是当移动到链接上时出现的“小手”.但现在越来越多的网页都使用了CSS鼠标指针技术,当将鼠标移动到链接上时,可以看到多种不同的效果.CSS可以通过cursor属性实现鼠标形状的改变,其属性可以是默认的鼠标形状default.小手形状hand.指示某对象可被移动move.交叉十字crosshair.文本选择器号text.Windows的沙漏形状wait.带有问号的鼠标help及各个方向的箭头属性值.例句如下: p {cur…

5  边框属性 边框属性用于设置一个元素的边框风格.边框宽度.边框颜色,可以一起设置4条边的边框,也可对上边框.右边框.下边框和左边框单独设置.分别介绍如下. a．边框风格属性 可以通过边框风格属性border-style设定上.下.左.右边框的风格,该属性用于设置一个元素边框的样式,而且必须用于指定可见的边框.可以使用1-4个关键字,如果4个值都给出了,则它们分别应用于上.右.下和左边框的样式.如果给出一个值,它将被运用到各边上.如果给出了两个或三个值,则省略了的值与对边相等.也可以分别使用b…

3  背景属性 大多数HTML元素都允许控制背景,包括背景颜色.背景图像.背景重复.背景附件.背景位置等属性.常见的控制背景属性.值及描述如表2所示. 表2  CSS中常见的控制背景的属性 除了使用表6-2中提供的背景属性控制HTML元素的背景样式,也可以将其简化为使用一行代码解决.通过背景类中的background属性实现,语法格式如下所示: background:  <背景颜色> || <背景图像> || <背景重复> || <背景附件> || <…

CSS中的样式属性比较多,经常使用的属性可以分为这么几类:字体.文本.背景.位置.边框.列表,以及其他一些样式属性.每个类中的属性都可以单独使用:如果同一个类中多个属性一起使用,还可以将它们整合为一行解决. 1  字体属性 通过字体属性可以设置字体的族科,改变字体的大小和风格,也可以调整字体加粗,以及让字体变形等.修饰字体的所有属性.值及描述如表6-1所示. 表1  CSS中修饰字体的属性 分别使用表1中字体类的每个样式属性,指定HTML的段落元素p中的字体为bold(粗体).italic(斜体…

有很多方法将样式表加入到HTML中,每种方法都有自己的优点和缺点.新的HTML元素和属性已被加入,以允许样式表与HTML文档更简易地组合起来.将样式表加入到HTML中的常用方法有内联样式表.嵌入一张样式表或链接到一张外部的样式表. 1  内嵌样式表 样式可以使用style属性内联,该属性可以应用于任意body元素(包括body本身),除了basefont.param和script标记.这个属性将任意数量的CSS声明当作自己的值,而每个声明用分号隔开,如下所示: <p style="colo…