用CSS打造韓式風(fēng)格網(wǎng)站

2024-02-07 分類：網(wǎng)站建設(shè)

韓國網(wǎng)站的設(shè)計風(fēng)格被國內(nèi)網(wǎng)站設(shè)計愛好者稱之為“韓式風(fēng)格”，而且現(xiàn)在越來越多的人正在模仿這種風(fēng)格，下圖為一個韓式風(fēng)格的網(wǎng)站效果，就筆者個人覺得韓式風(fēng)格的網(wǎng)站設(shè)計思路之所以受到大家的喜歡與其色彩變化豐富，合理應(yīng)用FLASH動畫，結(jié)構(gòu)新穎等特點是分不開的，但是韓式風(fēng)格的網(wǎng)站有一個最明顯的特點就是對于表格或是標(biāo)題欄常會加上橫或豎的一條色帶。

做這類圖我們一般都會想到用Photoshop等軟件來設(shè)計，當(dāng)然這也是常用的方法，但是如果網(wǎng)頁上這類圖片太多，或是較大時，像我們目前國內(nèi)的網(wǎng)絡(luò)環(huán)境要想打開你的網(wǎng)站可就有點累了，這里我就給大家講一講如何用CSS來做這樣的風(fēng)格，因為用CSS只是對顏色的定義，少了圖片的應(yīng)用，所以速度基本不會被影響。

首先，為頁面填加一個CSS效果類，具體設(shè)置如圖：

點擊OK后，會彈出具體的效果設(shè)置，打開其中的border標(biāo)簽，進行如下的設(shè)置：

然后將Background標(biāo)簽中的Background Color設(shè)置為：#BAEE66 在你要應(yīng)用這種風(fēng)格的表格上填加這個CSS效果就OK了，方法如圖：

最終的效果：

應(yīng)用這種方法，大家可以做出各式各樣的表格來，而且很方便，即使你不會用Photoshop等軟件也沒關(guān)系，而且打開速度基本不會變慢，是不是很棒，以下都是筆者試做的幾種風(fēng)格，大家可以根據(jù)border的設(shè)定再結(jié)合表格的設(shè)計來做出各式各樣的效果來，感興趣的朋友可以試一試。

本文來源于成都網(wǎng)站建設(shè)公司與成都網(wǎng)站設(shè)計制作公司-創(chuàng)新互聯(lián)成都公司！

分享標(biāo)題：用CSS打造韓式風(fēng)格網(wǎng)站
分享URL：http://www.bm7419.com/news16/316816.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供服務(wù)器托管、響應(yīng)式網(wǎng)站、做網(wǎng)站、網(wǎng)站內(nèi)鏈、企業(yè)網(wǎng)站制作、移動網(wǎng)站建設(shè)

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源：創(chuàng)新互聯(lián)

猜你還喜歡下面的內(nèi)容