網(wǎng)頁(yè)制作中還有一個(gè)網(wǎng)頁(yè)背景的概念。一個(gè)好的背景不但能影響訪問(wèn)者對(duì)網(wǎng)頁(yè)內(nèi)容的接受程度,還能影響訪問(wèn)者對(duì)整個(gè)網(wǎng)站的印象。有的大型網(wǎng)站也設(shè)置了背景,雖然說(shuō)圖片背景會(huì)降低網(wǎng)站的加載速度,但是卻以其優(yōu)美的樣子受人們的歡迎。下面我們來(lái)看下網(wǎng)頁(yè)背景的實(shí)現(xiàn)方式。
1.用顏色作為網(wǎng)頁(yè)背景
如果說(shuō)圖片背景會(huì)降低網(wǎng)站打開(kāi)速度,那么顏色背景就是一個(gè)良好的解決方案了。特別對(duì)于寬屏來(lái)說(shuō)。淡淡的顏色背景比白色的背景好看多了。顏色背景是為常用和為重要的,因?yàn)橄鄬?duì)于圖片背景來(lái)說(shuō),它有無(wú)與倫比的顯示速度上的優(yōu)勢(shì)。在網(wǎng)頁(yè)文件中,一般通過(guò)<body>標(biāo)簽來(lái)指定頁(yè)面的顏色背景,格式是:
<body bgcolor="color">其中的"color"表示想要放置的顏色,可以用各種不同的顏色表示方法,一般我們用顏色的十六進(jìn)制表示,如#aeaeae(淡灰色)、#ff0000(紅色)等等,此外還可以用百分比值法和整數(shù)法,其效果都是一樣的。
2.沙紋型網(wǎng)頁(yè)背景
我們?cè)诰W(wǎng)站制作的時(shí)候,如果沒(méi)有對(duì)背景顯示方法進(jìn)行控制,那么當(dāng)試圖把自己的照片作為頁(yè)面的背景是,卻發(fā)現(xiàn)瀏覽器上顯示出來(lái)的不僅僅是一個(gè)照片,而是同一照片在水平和豎直方向上的反復(fù)排列。即橫排和豎排,因?yàn)檫@個(gè)現(xiàn)象,我們可以用一小塊圖片作為頁(yè)面背景,讓他們鋪滿(mǎn)整個(gè)頁(yè)面。這樣就用不著大圖片做背景了,因?yàn)榇髨D片做背景,網(wǎng)頁(yè)打開(kāi)速度會(huì)慢的。 方法是:
<body background="picture"> 其中的picture表示背景圖片的URL路徑。
3.條狀背景
與沙紋背景不同的是,條狀背景只讓圖片在一個(gè)方向上重復(fù)排列。
首先用圖像處理軟件做一個(gè)從左到右為藍(lán)白漸變的水平條狀圖片,其長(zhǎng)度與頁(yè)面的寬度相當(dāng)。也通過(guò)
<body background="picture">
將其設(shè)為頁(yè)面背景。 這樣圖片就會(huì)在豎直方向排列了。還可以通過(guò)在<head>里面加入
<style type="text/css">
<!--
body {
background-image: url(picture);
background-repeat: repeat-x;
}
-->
</style>
來(lái)設(shè)置,其中picture是圖片的路徑。
無(wú)任何重復(fù)的背景
無(wú)任何重復(fù)的背景可以這樣來(lái)做,在<head>里面加入
<style type="text/css">
<!--
body {
background-image: url(file:///E|/web/my_web/../images/aboutus.jpg);
background-repeat: no-repeat;
}
-->
</style>