CSS打造色塊標(biāo)題標(biāo)識(shí)
更新時(shí)間：2006年09月25日 00:00:00 作者：
不少網(wǎng)站開始采用韓式風(fēng)格來(lái)建站.一般人都會(huì)想到用Photoshop等軟件來(lái)完成這樣的效果，但如果網(wǎng)頁(yè)上這類圖片太多，或是較大時(shí)，會(huì)給訪問帶來(lái)一定的困難。這里就給大家講一講如何用CSS來(lái)做這樣的風(fēng)格，因?yàn)橛肅SS只是對(duì)顏色的定義，少了圖片的應(yīng)用，所以基本不會(huì)影響速度。
這種風(fēng)格的特點(diǎn)是色彩變化豐富、應(yīng)用Flash動(dòng)畫合理、結(jié)構(gòu)新穎，最明顯的特點(diǎn)就是表格或標(biāo)題欄常會(huì)加上一條橫或豎的色帶，如圖中圈起來(lái)的地方就是這樣:
首先，在Dreamweaver MX 2004中為頁(yè)面添加一個(gè)CSS效果類，具體設(shè)置如圖。
點(diǎn)擊OK后，會(huì)彈出具體的效果設(shè)置，打開其中的border標(biāo)簽，進(jìn)行如圖的設(shè)置。
然后將Background標(biāo)簽中的Background Color設(shè)置為“#BAEE66”，在你要應(yīng)用這種風(fēng)格的表格上添加這個(gè)CSS效果就OK了。
應(yīng)用這種方法，大家可以做出各式各樣美觀且訪問速度很快的表格來(lái)，下圖是筆者試做的幾種風(fēng)格，大家可以根據(jù)border的設(shè)定再結(jié)合表格的設(shè)計(jì)來(lái)做出各式各樣的效果來(lái)。
這種風(fēng)格的特點(diǎn)是色彩變化豐富、應(yīng)用Flash動(dòng)畫合理、結(jié)構(gòu)新穎，最明顯的特點(diǎn)就是表格或標(biāo)題欄常會(huì)加上一條橫或豎的色帶，如圖中圈起來(lái)的地方就是這樣:
首先，在Dreamweaver MX 2004中為頁(yè)面添加一個(gè)CSS效果類，具體設(shè)置如圖。
點(diǎn)擊OK后，會(huì)彈出具體的效果設(shè)置，打開其中的border標(biāo)簽，進(jìn)行如圖的設(shè)置。
然后將Background標(biāo)簽中的Background Color設(shè)置為“#BAEE66”，在你要應(yīng)用這種風(fēng)格的表格上添加這個(gè)CSS效果就OK了。
應(yīng)用這種方法，大家可以做出各式各樣美觀且訪問速度很快的表格來(lái)，下圖是筆者試做的幾種風(fēng)格，大家可以根據(jù)border的設(shè)定再結(jié)合表格的設(shè)計(jì)來(lái)做出各式各樣的效果來(lái)。
相關(guān)文章
認(rèn)識(shí)CSS中absolute與relative
認(rèn)識(shí)CSS中absolute與relative...2006-09-09
這篇文章主要介紹了推薦一個(gè)好看Table表格的css樣式代碼詳解,本篇文章通過簡(jiǎn)要的案例,講解了該項(xiàng)技術(shù)的了解與使用,以下就是詳細(xì)內(nèi)容,需要的朋友可以參考下2021-08-08
未知大小圖片在已知容器中的垂直和水平居中問題...2006-09-09
圖片翻轉(zhuǎn)菜單技術(shù)研究...2006-09-09
HTML DOM setInterval和clearInterval方法案例詳解
這篇文章主要介紹了HTML DOM setInterval和clearInterval方法案例詳解2021-08-08
關(guān)于HTML的語(yǔ)義化標(biāo)簽和無(wú)語(yǔ)義化標(biāo)簽
這篇文章主要介紹了關(guān)于HTML的語(yǔ)義化標(biāo)簽和無(wú)語(yǔ)義化標(biāo)簽,語(yǔ)義化的標(biāo)簽，旨在讓標(biāo)簽有自己的含義，讓瀏覽器認(rèn)識(shí)這個(gè)標(biāo)簽所傳達(dá)的信息，是干什么的有什么作用,需要的朋友可以參考下2023-04-04
CSS解決未知高度垂直居中的問題...2006-09-09
HTML技巧匯編...2006-09-09
定義標(biāo)題的最好方法...2006-09-09
文字應(yīng)用css濾鏡集錦...2006-08-08