《門戶網(wǎng)站與大型網(wǎng)站的CSS架構(gòu)與組織》文章地址：http://www.tfxk.com/wangyesheji/jianzhanjingyan/0302349512013.htm
--> [網(wǎng)站建設(shè)之]門戶網(wǎng)站與大型網(wǎng)站的CSS架構(gòu)與組織 ,長尾關(guān)鍵詞在電子商務(wù)領(lǐng)域的應(yīng)用

對大型門戶，海量信息平臺及多模塊，多區(qū)域化網(wǎng)站，更須要對CSS，XHTML的標(biāo)準(zhǔn)化，合乎語意的HTML框架，復(fù)用性強的CSS代碼，這些才干保障你的網(wǎng)站，存在很好的“地基”。

第一部：對于構(gòu)建CSS框架我們要實現(xiàn)的目標(biāo)：

1.實現(xiàn)尺度化，具備主流平臺適應(yīng)性的前端實現(xiàn)；
2.疾速開發(fā)，在站點作風(fēng)斷定后，前端不應(yīng)當(dāng)成為整個名目里瓶頸；
3.重構(gòu)的需要，盡可能的讓類和區(qū)塊樣式可重用；
4.分別結(jié)構(gòu)和表示的需求，遵照了語義化結(jié)構(gòu)的約定;
5.構(gòu)架完整吻合金融網(wǎng)特色的CSS框架。
6.對代碼進行必要的搜尋引擎優(yōu)化。

第二部：關(guān)于CSS命名的一些商定：

1.不使用大寫情勢的類名和id名;
2.盡可能應(yīng)用描述性的英文單詞的組配合為類名跟id名;
3.id名及類名的多個英文單詞之間使用“_”短橫線分隔;
4.按區(qū)域進行描寫編號 例：main01_div01_ul01 (能夠懂得為主體第一區(qū)域 第一DIV下的第一個UL)

下來咱們要對整個網(wǎng)站及設(shè)計稿進行分析，去做契合本人門戶構(gòu)造特點的CSS框架。我們以新浪網(wǎng)為例子進行站點結(jié)構(gòu)剖析，全部頁面分為：首頁，更多頁，內(nèi)容頁，專題頁，數(shù)據(jù)核心,鏈接地址中CSS和JS后帶的問號是做什么的，新聞中央，頻道頁，廣告……

我們對這些頁面進行收拾，去發(fā)明他們的公共部分：CSS的樣式,及區(qū)域，模塊的碎片。我們需要做的是把這些公有的部門提出來,針對如何打造高質(zhì)量外鏈的技巧分享，我們可以把CSS分以下多少類：

主體款式表：sjweb.css
font(字體樣式，字號，顏色的集合)
layout(框架結(jié)構(gòu) 聚集)
global(全局默認(rèn)樣式集合)
component（組成頁面局部樣式表，模塊碎片集合）
這些講統(tǒng)統(tǒng)的被import到sjweb,針對不同的瀏覽器寫不同的CSS code.css主體樣式表里，主體樣式表做為一個loader加載新的外來樣式，好比廣告樣式表。

這樣這些頁面只要要寫一點點 屬于自己特別請求的CSS樣式代碼就可以了。

在構(gòu)建這個CSS框架的時候有良多細(xì)節(jié)的貨色最好能同一化,針對不同版本的IE瀏覽器的條件CSS應(yīng)用，比方：行間距，模塊之間距離間隔等。

規(guī)矩：

1.所有area之間，模塊之間，間距高低左右為：8 Pixel ;
2.消息列表色彩#333 ;
3.新聞列表行間距20 pixel；
……等等

調(diào)劑環(huán)境：IE7,ff,IE6,IE5.x,Opera Tag：門戶網(wǎng)站   門戶網(wǎng)站  
(責(zé)任編輯：網(wǎng)站建設(shè))
門戶網(wǎng)站與大型網(wǎng)站的CSS架構(gòu)與組織相關(guān)文章