DW中應(yīng)用CSS樣式表的幾種情況發(fā)布者:本站 時(shí)間:2022-05-21 11:05:40
一、 去除超級鏈接的下劃線以及在超級鏈接上實(shí)現(xiàn)鼠標(biāo)懸停變色:
在默認(rèn)情況下,用DreamWeaver設(shè)計(jì)的網(wǎng)頁中的超級鏈接都有下劃線,看上去不大美觀。要去除這些討厭的下劃線,很多報(bào)刊介紹的方法都是在HTML源代碼中手工加入一段代碼,其實(shí)在DreamWeave中很容易去除鏈接的下劃線。首先在DreamWeaver的Document Windows中隨便建立一個(gè)鏈接,你可以看到這個(gè)鏈接會(huì)有下劃線。怎樣去除這條下劃線呢?
1.在點(diǎn)擊菜單欄上的"Text"|"CSS Styles"| "Edit Style Sheet…"(或者直接按快捷鍵Ctrl+shift+E),調(diào)出Edit Style Sheet(編輯樣式表)對話框窗口。
2.點(diǎn)擊"New (新建)",然后在"New Style (新樣式)"對話框中,點(diǎn)擊"Use CSS Selector"按鈕。
3.在Selector欄中鍵入a, 然后點(diǎn)OK。
4.隨后彈出"CSS 樣式定義"對話框,在Type類的decoration(裝飾)中,勾選none,然后點(diǎn)OK,再點(diǎn)Done。你將立刻在Document Windows中發(fā)現(xiàn)鏈接的下劃線已經(jīng)消失了。那么又怎樣實(shí)現(xiàn)當(dāng)鼠標(biāo)懸停在鏈接上時(shí)鏈接變色呢?重復(fù)上述步驟中的的第一、第二步。然后點(diǎn)選Selector旁的下拉箭頭,選擇"a:hover",再點(diǎn)OK。在隨后彈出的 "Style definition for a: hover"對話框中,在Type類的color中任意選擇一種顏色(比如選擇紅色),然后點(diǎn)OK,再點(diǎn)Done便完成了。按F12預(yù)覽,將鼠標(biāo)放在鏈接上,該鏈接是不是變成了紅色?如果在剛才的"Style definition for a: hover"對話框中,在Backgroud(背景)類里,選擇backgroud的顏色為綠色,那么當(dāng)你把鼠標(biāo)放在超級鏈接上時(shí),不但鏈接會(huì)變成紅色,而且還會(huì)有綠色的背景。事實(shí)上,通過剛才的CSS 樣式定義對話框,你還可以實(shí)現(xiàn)更多的特殊效果,有興趣的朋友不妨去好好琢磨一下。
二、創(chuàng)建可反復(fù)使用的外部CSS樣式表
用DreamWeaver在某網(wǎng)頁中創(chuàng)建了一種CSS樣式后,如果你要在另外的網(wǎng)頁中應(yīng)用該樣式,你不必從新創(chuàng)建該CSS樣式,只要你創(chuàng)建了外部CSS樣式表文件(external CSS style sheet),你便可以在今后任意調(diào)用該樣式表文件中的樣式。為了便于管理,先在站點(diǎn)所在文件夾中,新建一個(gè)文件夾,取名為CSS,專門用于放置外部樣式表文件(其擴(kuò)展名為css)。
1、在Document Window中按Ctrl+shift+E,調(diào)出Edit Style Sheet(編輯樣式表)對話框窗口
2、點(diǎn)擊"link"。
3、在彈出的Link External Style Sheet(鏈接外部樣式表)對話框,點(diǎn)BROWSE,找到剛才創(chuàng)建的CSS文件夾。
4、在Select Stylesheet File (選擇樣式表文件)窗口"文件名"欄中,鍵入*.css (*可以為任意名),請注意,事實(shí)上此時(shí)在CSS文件夾中并無樣式表文件,在"文件名"欄中鍵入的新名字將成為外部樣式表新文件的名字。比如鍵入title.css,,然后點(diǎn)Select | OK。
5、在Edit Style Sheet(編輯樣式表)對話框窗口中,會(huì)新增加 title.css (link), 雙擊它。
6、在彈出的"title.css"窗口中,點(diǎn)"New"。
7、在"New Style"對話框中,點(diǎn)選"Make Custom Style (class)"按鈕
8、在Name欄中鍵入某個(gè)名字,如myheadline,點(diǎn)OK。
9、在接下來的"Style definition for .myheadline in title.css"對話框中,進(jìn)行字體、顏色等各種設(shè)置,完成后點(diǎn)OK。如還要?jiǎng)?chuàng)建新的樣式,再點(diǎn)"New",重復(fù)剛才的步驟6、7、8、9,最后點(diǎn)"save"| "done",于是title.css這個(gè)外部樣式表文件便創(chuàng)建好了。菜單欄上的"TEXT" |"CSS Styles"子菜單中將會(huì)列出title.css中的所有樣式。如要在其他網(wǎng)頁中調(diào)用這個(gè)title.css,只需重復(fù)上述1至3步,然后在Select Stylesheet File窗口"文件名"欄中輸入title.css。點(diǎn)"select"| "ok"| "done", title.css中所有的樣式便會(huì)出現(xiàn)在該網(wǎng)頁菜單欄上的"Text" |"CSS Styles"子菜單中,你將可以在此網(wǎng)頁中應(yīng)用這些樣式。
選擇我們,優(yōu)質(zhì)服務(wù),不容錯(cuò)過
1. 優(yōu)秀的網(wǎng)絡(luò)資源,強(qiáng)大的網(wǎng)站優(yōu)化技術(shù),穩(wěn)定的網(wǎng)站和速度保證
2. 15年上海網(wǎng)站建設(shè)經(jīng)驗(yàn),優(yōu)秀的技術(shù)和設(shè)計(jì)水平,更放心
3. 全程省心服務(wù),不必?fù)?dān)心自己不懂網(wǎng)絡(luò),更省心。
------------------------------------------------------------
24小時(shí)聯(lián)系電話:021-58370032
關(guān)鍵詞標(biāo)簽:上海網(wǎng)站建設(shè) 上海網(wǎng)站制作 網(wǎng)站優(yōu)化 小程序開發(fā)