做博客類的設(shè)計(jì)一款自己的主題就非常有成就感，但CSS就格外顯示的重要。下面由學(xué)習(xí)啦小編為大家整理的CSS制作方法，希望大家喜歡!

　　CSS制作方法

　　1.細(xì)致構(gòu)思網(wǎng)頁(yè)框架

　　很多初學(xué)者犯一個(gè)錯(cuò)誤，那就是網(wǎng)頁(yè)的基本框架還沒有定義好，就開始著手思考CSS樣式，這是造成CSS樣式混亂的一個(gè)重要原因。應(yīng)該細(xì)致，精密的構(gòu)思出整個(gè)網(wǎng)頁(yè)的框架，并將其畫在紙上或是畫在VISIO里，嚴(yán)格的定義出來。這樣我們才有足夠的章法去規(guī)劃CSS樣式表。

　　2.使用規(guī)范的名稱與良好的注釋習(xí)慣

　　有些時(shí)候，我們做的網(wǎng)頁(yè)可能完成后會(huì)很久不動(dòng)，也可能會(huì)交給其他人打理，那這事兒可能就麻煩了。沒有一個(gè)良好的命名規(guī)范與注釋的話，很可能造成自己或維護(hù)的人完全不知道里面寫的這是什么意思，還需要從頭去認(rèn)真的研究一番，耗時(shí)耗力。

　　因此，不論是為了我們自己還是為了日后維護(hù)的人，都應(yīng)該盡可能的使用規(guī)范的名稱來定義每一個(gè)類或者ID

　　3.從外至里，從上至下，從左至右

　　與其說這是制定規(guī)范CSS的基本方向，不如說是制定規(guī)范網(wǎng)頁(yè)的基本方法。我們?cè)跇?gòu)思網(wǎng)頁(yè)時(shí)一般都是按照這樣的思路來劃分區(qū)域，而在CSS中勢(shì)必也應(yīng)按照這樣的順序來書寫并按照區(qū)域加上注釋，以便在我們?nèi)蘸蟮木S護(hù)中更容易尋找某個(gè)定義的類或者ID。

　　4.補(bǔ)充的樣式盡可能做到頁(yè)面與表現(xiàn)完全分離

　　有時(shí)候我們?cè)谕瓿烧麄€(gè)頁(yè)面后，仍然需要添加一些樣式，對(duì)其進(jìn)行修改，此時(shí)，我們一定要避免直接在頁(yè)面寫“style=”，而一定要做到頁(yè)面與表現(xiàn)分離，耐心的將補(bǔ)充的樣式寫進(jìn)樣式表。方便日后的維護(hù)。

　　CSS的垃圾行為

　　1、隱藏文本中的CSS代碼，這是個(gè)很老套的SEO黑帽方法了，在頁(yè)面中利用CSS代碼，讓某些關(guān)鍵詞隱藏起來，訪客看不到，只讓搜索引擎看到，借此來增加關(guān)鍵詞的密度，提升排名，這種方法已經(jīng)過時(shí)了，搜索引擎已經(jīng)很容易判斷出來了。

　　2、利用CSS某種樣式，添加隱藏文字，設(shè)定某個(gè)格式元素的“display”屬性為“none”，或者將其顯示位置超出屏幕范圍，然后在此格式元素下添加大量蘊(yùn)含豐富關(guān)鍵詞，借此提高網(wǎng)站排名。

　　3、CSS沒有外置，網(wǎng)站頁(yè)面中出現(xiàn)大量的CSS代碼，大量的CSS代碼集中在網(wǎng)頁(yè)中，而網(wǎng)頁(yè)中的CSS代碼更是困擾著搜索引擎的耐性，不厭其煩的搜索你網(wǎng)站中的正文，這種方法對(duì)網(wǎng)站排名的影響，可想而知。

　　黑帽方法下的CSS利用，雖然，這些元素在瀏覽器下不可見，訪客可能不會(huì)覺察到網(wǎng)頁(yè)中字句的存在，而對(duì)搜索引擎來說這些不可見的CSS元素與頁(yè)面的正常組成部分沒有區(qū)別，所以，不要以為刻意的利用CSS做這些黑帽的行為。

　　而對(duì)于無意而為之的CSS垃圾行為，那就需要稍加注意了，不要讓代碼大量出現(xiàn)在網(wǎng)頁(yè)中，讓蜘蛛更快的訪問到網(wǎng)站正文，抓取到頁(yè)面，實(shí)現(xiàn)長(zhǎng)期有效的網(wǎng)站優(yōu)化效果，前提是確保優(yōu)化中避免使用各類spam技術(shù)，即使無意中使用了類似的技術(shù)，網(wǎng)站遲早要被搜索引擎懲罰甚至被封，所以，對(duì)于一切的垃圾優(yōu)化行為都不要去做。

　　用div+css模板打造QQ站

　　1.選擇網(wǎng)站主題，確定網(wǎng)站目標(biāo)關(guān)鍵字

　　以前做站雖然知道有關(guān)鍵字這么一說，但是沒有深刻的理解，對(duì)關(guān)鍵字的效果也沒有概念。一個(gè)網(wǎng)站的關(guān)鍵字基本上可以確定了流量的最大上限，因此選擇網(wǎng)站主題和關(guān)鍵字一定要選有人氣的，不愿做的兵永遠(yuǎn)不是好兵，做站也一樣。

　　我的目標(biāo)關(guān)鍵字是QQ網(wǎng)名，QQ站的人氣勢(shì)眾所周知的。當(dāng)然我選擇關(guān)鍵字也要有一定的策略，目前我的主打得關(guān)鍵字是QQ情侶網(wǎng)名和QQ網(wǎng)名大全，打算等網(wǎng)站發(fā)展到一定階段再向QQ網(wǎng)名過渡。這也是目前比較流行的做法，沒辦法現(xiàn)在做站的人太多了，競(jìng)爭(zhēng)也太激烈了，每個(gè)關(guān)鍵字都已經(jīng)有好多人在做了。

　　2.選擇合適的div+css模板

　　因?yàn)镼Q網(wǎng)名是文字類為主的站，因此我選了款以文字為主的div+css模板?，F(xiàn)在有很多div+css的免費(fèi)模板資源，你只要去百度和google搜一下div+css模板就可以找到許多，一般都提供圖片預(yù)覽或者在線DEMO瀏覽，因此選擇起來還是很方便的。

　　我是在我自己之前的那個(gè)網(wǎng)頁(yè)設(shè)計(jì)類的網(wǎng)站上找的模板，因此也沒費(fèi)太多工夫?？紤]到QQ站是娛樂休閑類，就選了一款帶多款css切換的模板，打算以后加上皮膚切換的功能，可以給人一些新鮮感。

　　3.選div+css模板需要考慮以下兩個(gè)因素：

　　（1）選擇適合自己網(wǎng)站主題風(fēng)格的模板

　　如果是文字類的站就不要選那種全部是圖片組成的模板，相反如果是圖片站當(dāng)然不要選那種整個(gè)模板都沒幾個(gè)圖的模板。一般來講，好的模板網(wǎng)站都會(huì)給出模板的用途和分類，比如博客模板，企業(yè)模板等。另外顏色和風(fēng)格也要符合自己網(wǎng)站特點(diǎn)，這個(gè)就要看站長(zhǎng)個(gè)人的口味和判斷了。

　?。?）選模板最好要選那種帶內(nèi)頁(yè)和導(dǎo)航頁(yè)模板

　　因?yàn)樵S多模板只是提供主頁(yè)的模板，因此如果你不具備一定的網(wǎng)頁(yè)div+css設(shè)計(jì)能力的話，即使模板再好看你也最好不要去用，否則首頁(yè)做出來了，內(nèi)頁(yè)卻需要花費(fèi)大量精力去自己設(shè)計(jì)，而且很容易和主頁(yè)風(fēng)格出入很大，效果就大打折扣了。

　　4.選擇合適的CMS系統(tǒng)

　　我用的是織夢(mèng)CMS系統(tǒng)，也是目前比較流行的CMS系統(tǒng)之一,是PHP語(yǔ)言的，還有一些像帝國(guó)CMS等也都不錯(cuò)。另外比較簡(jiǎn)單的asp有無憂cms(只適合簡(jiǎn)單的網(wǎng)站結(jié)構(gòu)，沒有專題，友情鏈接等功能模塊，第三方的插件也幾乎沒有，使用前一定要考慮清楚)。選好CMS系統(tǒng)后一定要仔細(xì)看官方的使用說明和幫助，即使需要消耗一定的時(shí)間也要仔細(xì)看，省得以后繞彎路。

　　5.修改div+css模板打造QQ站

　　選好模板和cms系統(tǒng)后，接下來就是將織夢(mèng)的模板標(biāo)簽加入到所選擇的div+css模板中去。這一步非常消耗時(shí)間和精力，一定要有耐性，而且要多測(cè)試效果，特別是記得要在IE不同版本和FF中預(yù)覽，看看是否都能正確顯示。