使用前端技术展现Web系统（蓝桥杯软件大赛培训教材-Java方向）
上QQ阅读APP看本书，新人免费读10天
设备和账号都新为新人
上一章目录下一章

1.8 HTML主体标签

<body>是HTML的主体标签，在<body>和</body>中放置的是页面显示的内容，如文字、图像、链接、表格、列表和表单等。<body>标签自身有一些属性，如定义页面文字的颜色、背景颜色、背景图像等，如表1.3所示。需要注意的是，在HTML 4.01（HTML 5之前最后一个HTML版本，也是使用最为广泛的HTML版本）中，所有<body>标签的属性都不被赞成使用，建议用样式表取代，而在XHTML 1.0严格的DTD要求下，这些属性均不被支持。我们之后学习的标签属性，不少也是不被赞成使用，建议用样式表取代。

虽然这些属性不被赞成使用，但我们学习它们的目的主要包括，这里面的一些属性不仅仅能对<body>标签进行补充说明，也能够对其他标签进行说明，学会用这些属性说明<body>标签的同时也学会了对其他标签的补充说明。另外，一些遗留项目或没有完全按照HTML规范开发的Web项目可能也用到了这些属性修饰<body>标签，所以我们也要知道这些标签的目的和作用。最后，使用样式表替代这些标签属性，样式表里面的内容也是基于这些标签属性的，所以也需要学习。

表1.3 <body>标签属性

1.8.1 text和bgcolor属性

● text属性

text属性可以改变整个页面文字的默认颜色，在没有对文字进行单独定义颜色时，这个属性将对页面中所有的文字产生作用。

基本语法：

    <body text="value">

其中，text表示文字颜色定义，value表示指定的颜色。

在HTML中，颜色有两种表示方式。一种是用颜色名称表示，比如red表示红色，blue表示蓝色。另外一种是用十六进制的数值表示RGB（Red、Green、Blue）的颜色值，RGB每个原色的最小值是0，最大值是255，换算成十六进制表示为从#00到#FF。比如红、绿、蓝三原色最小值组成的RGB(0,0,0)，十六进制表示为#000000，代表的是黑色；而RGB(255,255,255)，十六进制表示为#FFFFFF，代表的是白色。

另外，并不是所有的颜色都可以用颜色名称表示，HTML中只有16种颜色定义了颜色名称，它们分别是aqua、black、blue、fuchsia、gray、green、lime、maroon、navy、olive、purple、red、silver、teal、white和yellow，其他的颜色都要用十六进制RGB颜色值表示。

● bgcolor属性

text属性设置的是<body>里的文本颜色，bgcolor属性用来设置整个页面的背景颜色。

基本语法：

    <body bgcolor="value">

接下来修改之前编写的index.html文档，演示text属性和bgcolor属性的作用。假设我们需要页面显示的背景颜色为黑色，文字颜色为黄色，则修改<body>标签的属性值如下，显示结果如图1.8所示。

    <body text="yellow" bgcolor="#000000">
        <h1 align="center">学习《使用前端技术展现Web系统》课程</h1>
    </body>

图1.8 text和bgcolor属性

1.8.2 background和bgproperties属性

● background属性

在我们浏览网页时，尤其是浏览一些个性化的主页时，一些页面的背景常常是一些优美或者独具个性的图片。要想达到这一目的，可以通过设置<body>标签的background属性。需要注意的是背景图片和在页面中插入图片是两个概念，背景图片会将图片放在页面的最底层，文字或其他插入的图片位于背景图片之上。默认情况下，背景图片在水平方向和垂直方向上会不断重复出现，直到铺满整个网页。

基本语法：

    <body background="img_URL">

其中，background表示背景图像定义，img_URL表示图像的完整路径。这里图像的完整路径既可以是服务器本地的图片，也可以是引用互联网上的资源图片。下面的例子使用了服务器本地的图片作为页面的背景，显示结果如图1.9所示。

    <body background="images/bg.jpg">
        <h1 align="center">学习《使用前端技术展现Web系统》课程</h1>
    </body>

图1.9 background属性

● bgproperties属性

在默认的情况下，如果页面的内容较长（例如将上面案例中“<h1 align="center">学习《使用前端技术展现Web系统》课程</h1>”代码复制50行），当拖动浏览器滚动条时，背景会随着文字内容的滚动而滚动。如果我们希望背景不动，只是内容滚动，则可以设置bgproperties属性。

基本语法：

    <body background="img_URL" bgproperties="fixed">

其中bgproperties="fixed"表示设定页面的背景图像为固定，不随页面内容的滚动而滚动。

需要强调的是，该属性不是HTML 4.01和XHTML1.0支持的标准属性，IE及采用IE内核的浏览器支持该属性，而火狐浏览器就不支持该属性。作为软件开发人员，这类非标准的属性，我们在开发过程中尽量不要使用，否则会出现客户端兼容性问题。

1.8.3 link、alink和vlink属性

超链接是网页中最基本的元素，也是最常用的元素。用户可以单击超链接从一个页面链接到另一个页面，实现页面之间的跳转。

默认情况下，未单击的链接其文字颜色是蓝色的，鼠标按下链接时文字颜色是红色的，访问过之后文字颜色变为紫色。如果网页设计和开发人员希望调整这些颜色的设置，可以通过设置<body>标签的link、alink和vlink这三个对应的属性值进行改变。

基本语法：

    <body link="value" alink="value" vlink="value">

其中link、alink、vlink这三个属性值分别定义表1.3中指定的链接文字颜色。假设我们需要链接文字的颜色为红色，按下时显示为黄色，访问过后显示为黑色，则可以通过如下的代码进行调整。

    <body link="red" alink="yellow" vlink="#000000">
        <h1><a href="http://www.sohu.com">搜狐主页</a></h1>
    </body>
上一章目录下一章