?
本文檔使用 php中文網(wǎng)手冊(cè) 發(fā)布
好的背景使站點(diǎn)看上去特別棒。
搭配良好的背景和顏色
<html> <body bgcolor="#d0d0d0"> <p> 這是段落。這是段落。這是段落。這是段落。這是段落。這是段落。這是段落。這是段落。這是段落。這是段落。 </p> <p> 這是另一個(gè)段落。這是另一個(gè)段落。這是另一個(gè)段落。這是另一個(gè)段落。這是另一個(gè)段落。這是另一個(gè)段落。這是另一個(gè)段落。 </p> </body> </html>
搭配得不好的背景和顏色
<html> <body bgcolor="#ffffff" text="yellow"> <p> 這是段落。這是段落。這是段落。這是段落。這是段落。這是段落。這是段落。這是段落。這是段落。這是段落。 </p> <p> 這是另一個(gè)段落。這是另一個(gè)段落。這是另一個(gè)段落。這是另一個(gè)段落。這是另一個(gè)段落。這是另一個(gè)段落。這是另一個(gè)段落。 </p> </body> </html>
(可以在本頁底端找到更多實(shí)例。)
<body> 擁有兩個(gè)配置背景的標(biāo)簽。背景可以是顏色或者圖像。
背景顏色屬性將背景設(shè)置為某種顏色。屬性值可以是十六進(jìn)制數(shù)、RGB 值或顏色名。
<body bgcolor="#000000"> <body bgcolor="rgb(0,0,0)"> <body bgcolor="black">
以上的代碼均將背景顏色設(shè)置為黑色。
背景屬性將背景設(shè)置為圖像。屬性值為圖像的URL。如果圖像尺寸小于瀏覽器窗口,那么圖像將在整個(gè)瀏覽器窗口進(jìn)行復(fù)制。
<body background="clouds.gif"> <body background="http://www.miracleart.cn/clouds.gif">
URL可以是相對(duì)地址,如第一行代碼。也可以使絕對(duì)地址,如第二行代碼。
提示:如果你打算使用背景圖片,你需要緊記一下幾點(diǎn):
背景圖像是否增加了頁面的加載時(shí)間。小貼士:圖像文件不應(yīng)超過 10k。
背景圖像是否與頁面中的其他圖象搭配良好。
背景圖像是否與頁面中的文字顏色搭配良好。
圖像在頁面中平鋪后,看上去還可以嗎?
對(duì)文字的注意力被背景圖像喧賓奪主了嗎?
<body> 標(biāo)簽中的背景顏色(bgcolor)、背景(background)和文本(text)屬性在最新的 HTML 標(biāo)準(zhǔn)(HTML4 和 XHTML)中已被廢棄。W3C 在他們的推薦標(biāo)準(zhǔn)中已刪除這些屬性。
應(yīng)該使用層疊樣式表(CSS)來定義 HTML 元素的布局和顯示屬性。
可用性強(qiáng)的背景圖像
<html> <body background="/i/eg_bg_06.gif"> <h3>圖像背景</h3> <p>gif 和 jpg 文件均可用作 HTML 背景。</p> <p>如果圖像小于頁面,圖像會(huì)進(jìn)行重復(fù)。</p> </body> </html>
可用性強(qiáng)的背景圖像 2
<html> <body background="/i/eg_bg_04.gif"> <h3>圖像背景</h3> <p>gif 和 jpg 文件均可用作 HTML 背景。</p> <p>如果圖像小于頁面,圖像會(huì)進(jìn)行重復(fù)。</p> </body> </html>
可用性差的背景圖像
<html> <body background="/i/eg_bg_01.gif"> <h3>圖像背景</h3> <p>gif 和 jpg 文件均可用作 HTML 背景。</p> <p>如果圖像小于頁面,圖像會(huì)進(jìn)行重復(fù)。</p> </body> </html>