不少網站開始采用韓式風格來建站，這種風格的特點是色彩變化豐富、應用Flash動畫合理、結構新穎，最明顯的特點就是表格或標題欄常會加上一條橫或豎的色帶，如圖1中圈起來的地方就是這樣。

(圖一)

一般人都會想到用Photoshop等軟件來完成這樣的效果，但如果網頁上這類圖片太多，或是較大時，會給訪問帶來一定的困難。這里就給大家講一講如何用CSS來做這樣的風格，因為用CSS只是對顏色的定義，少了圖片的應用，所以基本不會影響速度。

首先，在Dreamweaver MX 2004中為頁面添加一個CSS效果類，具體設置如圖2。

(圖二)

點擊OK后，會彈出具體的效果設置，打開其中的border標簽，進行如圖3的設置。

(圖三)

然后將Background標簽中的Background Color設置為“#BAEE66”，在你要應用這種風格的表格上添加這個CSS效果就OK了。

應用這種方法，大家可以做出各式各樣美觀且訪問速度很快的表格來，圖4是筆者試做的幾種風格，大家可以根據border的設定再結合表格的設計來做出各式各樣的效果來。

(圖四)

出處：電腦報

責任編輯：三分油菜田

◎進入論壇網頁制作、網站綜合版塊參加討論

總結

以上是生活随笔為你收集整理的html标题前色块,CSS轻松实现色块标题标识的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。