Dreamweaver CS3中的CSS規(guī)矩

在 Dreamweaver CS3 中，CSS（層疊樣式表）規(guī)則用于定義網(wǎng)頁(yè)元素的樣式。DreamWeaver CS3網(wǎng)頁(yè)制造中的CSS布局規(guī)矩。

 

　　CSS文件的鏈接辦法

 　　1、附加鏈接：外部CSS

 

　　2、導(dǎo)入CSS：常用運(yùn)用多個(gè)CSS文件時(shí)，將多個(gè)CSS導(dǎo)入一個(gè)CSS文件中

 

　　CSS規(guī)矩界說(shuō)有三種

 

　　1、類比如“.RedText”、“.BlueText”和“.BigText”等等

 

　　2、標(biāo)簽針對(duì)原有HTML標(biāo)簽做的從頭CSS界說(shuō)

 

　　3、高檔偽類、界說(shuō)了ID的元素，以及歸納性界說(shuō)

 

　　CSS規(guī)矩的運(yùn)用 

 

　　1、只要“類”款式才需要運(yùn)用，class=”xxxx”。任何元素都能夠運(yùn)用類。

 

　　2、class與id的區(qū)別

 

　　3、標(biāo)簽運(yùn)用一般關(guān)于“body”標(biāo)簽一次性運(yùn)用，關(guān)于諸如“l(fā)i”、“td”等在頁(yè)面中重復(fù)性比較大的標(biāo)簽不引薦界說(shuō)。

 

　　4、高檔多運(yùn)用，界說(shuō)“#id li”比界說(shuō)“l(fā)i”要好得多。

 

　　CSS規(guī)矩的履行次序

 

　　1、依照CSS代碼的履行先后次序

 

　　2、假如有重復(fù)的規(guī)矩，依照后履行的界說(shuō)

 

　　3、終規(guī)矩是多個(gè)界說(shuō)規(guī)矩的歸納

 

　　要點(diǎn)：高檔規(guī)矩界說(shuō)

 

　　1、關(guān)于不同表格的文字款式界說(shuō)。(不同表格運(yùn)用不同ID、運(yùn)用類款式界說(shuō))

 

　　2、一頁(yè)中的多種超級(jí)鏈接款式界說(shuō) 

 

　　3、多個(gè)相同規(guī)矩不同對(duì)象的CSS共同界說(shuō)

 

4、關(guān)于同一對(duì)象界說(shuō)的多種CSS辦法考慮哪種更科學(xué)(擴(kuò)展性和代碼精簡(jiǎn)性)

 

 

教你快速定位到雜亂的CSS BUG問(wèn)題

 

信任咱們關(guān)于常見(jiàn) CSS BUG 的處理現(xiàn)已相對(duì)比較熟悉，例如：IE6 Three Pixel Gap、IE5/6 Doubled Float-Margin Bug 等等。但經(jīng)常咱們也會(huì)碰到雜亂的 CSS BUG 問(wèn)題，所謂“雜亂”實(shí)質(zhì)是指觸發(fā)的條件很雜亂，而“BUG” 也并非指一定是瀏覽器的 BUG 。關(guān)于此類問(wèn)題，咱們首先要處理的是如何定位到問(wèn)題，只要快速的定位到問(wèn)題，才干更好的處理問(wèn)題。

 　　關(guān)于快速定位，個(gè)人的經(jīng)歷處理一般如下(基本能夠定位到我在 淘寶 遇到的 90% 以上的雜亂 CSS BUG 問(wèn)題)：

 

　　1、查看頁(yè)面的標(biāo)簽是否閉合

 

　　不要小看這條，或許折騰了你兩天都沒(méi)有處理的 CSS BUG 問(wèn)題，卻只是源于這兒。畢竟頁(yè)面的模板一般都是由開(kāi)發(fā)來(lái)嵌套的，而他們很簡(jiǎn)單犯此類問(wèn)題。

 

　　方便提示：能夠用 Dreamweaver 打開(kāi)文件查看，一般沒(méi)有閉合的標(biāo)簽，會(huì)黃色布景高亮。

 

　　2、款式排除法

 

　　有些雜亂的頁(yè)面或許加載了 N 個(gè)外鏈 CSS 文件，那么逐一刪除 CSS 文件，找到 BUG 觸發(fā)的詳細(xì) CSS 文件，縮小鎖定的規(guī)模。

 

　　關(guān)于方才鎖定的問(wèn)題 CSS 款式文件，逐行刪除詳細(xì)的款式界說(shuō)，定位到詳細(xì)的觸發(fā)款式界說(shuō)，甚至是詳細(xì)的觸發(fā)款式特點(diǎn)。

 

　　3、模塊確認(rèn)法

 

　　有時(shí)分咱們也能夠從頁(yè)面的 HTML 元素出發(fā)。刪除頁(yè)面中不同的 HTML 模塊，尋找到觸發(fā)問(wèn)題的 HTML 模塊。

 

　　4、查看是否鏟除起浮

 

　　其實(shí)有不少的 CSS BUG 問(wèn)題是因?yàn)闆](méi)有鏟除起浮形成的。養(yǎng)成杰出的鏟除起浮的習(xí)慣是必要的，引薦運(yùn)用 無(wú)額定 HTML 標(biāo)簽的鏟除起浮的辦法(盡量防止運(yùn)用overflow:hidden;zoom:1 的相似辦法來(lái)鏟除起浮，會(huì)有太多的限制性)。

 

　　5、查看 IE 下是否觸發(fā) haslayout

 

　　很多的 IE 下雜亂 CSS BUG 都與 IE 特有的 haslayout 息息相關(guān)。熟悉和理解 haslayout 關(guān)于處理雜亂的 CSS BUG 會(huì)事半功倍。

 

　　方便提示：假如觸發(fā)了 haslayout，IE 的調(diào)試工具 IE Developer Toolbar 中的特點(diǎn)中將會(huì)顯示 haslayout 值為 -1。

 

　　6、邊框布景調(diào)試法

 

故名思議便是給元素設(shè)置顯眼的邊框或者布景(一般黑色或紅色)，進(jìn)行調(diào)試。此辦法是常用的調(diào)試 CSS BUG 的辦法之一，關(guān)于雜亂 BUG 仍舊適用。經(jīng)濟(jì)實(shí)惠還環(huán)保^^

 

后想給咱們著重一點(diǎn)的是，養(yǎng)成杰出的書寫習(xí)慣，削減額定標(biāo)簽，盡量語(yǔ)義，符合規(guī)范，其實(shí)能夠?yàn)樵蹅兿鳒p很多額定的雜亂 CSS BUG，更多的時(shí)分其實(shí)是咱們自己給自己制造了費(fèi)事。希望咱們遠(yuǎn)離 BUG ，日子越來(lái)越夸姣。通過(guò)合理使用 CSS 規(guī)則，可以有效地控制網(wǎng)頁(yè)的布局和外觀，實(shí)現(xiàn)豐富多樣的設(shè)計(jì)效果。