CSS设置页面背景色
生活随笔
收集整理的這篇文章主要介紹了
CSS设置页面背景色
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
CSS設(shè)置頁面背景色
? ? ? ? ? 設(shè)置頁面的背景色
? ? ? ? ??CSS通過設(shè)置body標(biāo)記的background-color屬性來實現(xiàn)，背景色主要突出頁面的主題，跟前景的文字顏色相配合。
? ? ? ? ??具體的設(shè)定方法和文字顏色值的設(shè)定一樣，可以采用十六進(jìn)制、RGB各分量，或者顏色的英文單詞等。
<span style="font-size:24px;"><html><head><title>背景顏色</title><style><!--body{background-color:#5b8a00;margin:0px;padding:0px;color:#c4f762;}p{font-size:15px;padding-left:10px;padding-top:8px;line-height:120%;}span{font-size:80px;font-family:黑體;float:left;padding-right:5px;padding-left:10px;padding-top:8px;}--></style></head><body><img src=" http://scs.ganjistatic1.com/gjfs12/M09/A3/B3/CgEHC1VGJz2HZm6eAAEe8iEJ1Go460_600-0_6-0.jpg "style="float:right;"><span>春</span><p>季，地球的北半球開始傾向太陽，收到越來越多的太陽光直射，因而氣溫開始升高。隨著冰雪消融，河流水位上漲。春季植物開始發(fā)芽生長，許多鮮花開放。冬眠的動物蘇醒，許多以卵過冬的動物孵化，鳥類開始遷移，離開越冬地向繁衍地進(jìn)發(fā)。許多動物在這段時間里發(fā)情，因此中國也將春季稱為“萬物復(fù)蘇”的季節(jié)。春季氣溫和生物界的變化對人的心理和生理也有影響。</p><p>對農(nóng)民來說，春季是播種許多農(nóng)作物的季節(jié)。在春季，地球的北半球開始傾向太陽，收到越來越多的太陽光直射，因而氣溫開始升高。隨著冰雪消融，河流水位上漲。春季植物開始發(fā)芽生長，許多鮮花開放。冬眠的動物蘇醒，許多以卵過冬的動物孵化，鳥類開始遷移，離開越冬地向繁衍地進(jìn)發(fā)。許多動物在這段時間里發(fā)情，因此中國也將春季稱為“萬物復(fù)蘇”的季節(jié)。春季氣溫和生物界的變化對人的心理和生理也有影響。</p></body> </html></span> ? ? ? ? ??代碼如上，可以看到背景顏色為深綠色，文字的顏色為亮綠色，再加上圖片以及文字內(nèi)容本身，將春天萬物復(fù)蘇顯示了出來。? ? ? ? ??用背景色給頁面分塊
? ? ? ? ??Background-color屬性不僅可以設(shè)置頁面的背景顏色，幾乎所有的HTML元素的背景色都可以通過它來設(shè)定。
? ? ? ? ??因此，很多網(wǎng)頁都通過設(shè)定不同的背景色來實現(xiàn)分塊的效果。
<span style="font-size:24px;"><html><head><title>利用背景顏色分塊</title><style><!--body{padding:0px;margin:0px;background-color:#ffebe5;}.topbanner{background-color:#fbc9ba;}.leftbanner{width:22%;height:330px;vertical-align:top;background-color:#6d1700;color:#FFFFFF;text-align:left;padding-left:40px;font-size:14px;}.mainpart{text-align:center;}--></style></head><body><table cellpadding="0"cellspacing="1" width="100%" border="0"><tr><td colspan="2"class="topbanner"><img src=" http://scs.ganjistatic1.com/gjfs12/M09/A3/B3/CgEHC1VGJz2HZm6eAAEe8iEJ1Go460_600-0_6-0.jpg "border="0"></td></tr><tr><td class="leftbanner"><br><br>首頁<br><br>分類討論<br><br>談天說地<br><br>精華區(qū)<br><br>我的信箱<br><br>休閑娛樂<br><br>立即注冊<br><br>離開本站</td><td class="mainpart">正文內(nèi)容……</td></tr></body> </html></span> ? ? ? ? ??代碼如上，頂端的Banner、左側(cè)的導(dǎo)航條和中間的正文部分分別運(yùn)用了3中不同的背景顏色，實現(xiàn)了頁面分塊的目的，這種分塊的方法在網(wǎng)頁制作中經(jīng)常使用。? ? ? ? ??這里，頂端的Banner圖片可以是一副，從左到右顏色漸變的圖片，顏色由本身的圖片過渡到頁面的背景顏色，就會顯示十分自然，這種效果在Photoshop中很容易實現(xiàn)，也是網(wǎng)頁制作的常用方法。
總結(jié)
以上是生活随笔為你收集整理的CSS设置页面背景色的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： CSS设置列表的符号
- 下一篇： CSS设置无需表格的菜单