資源描述:
《dreamweaver8.0創(chuàng)建css樣式》由會員上傳分享,免費在線閱讀,更多相關內容在行業(yè)資料-天天文庫。
1、Dreamweaver8.0創(chuàng)建CSS樣式層疊樣式表(CSS)是一系列格式設置規(guī)則,它們控制Web頁面內容的外觀。使用CSS設置頁面格式時,內容與表現形式是相互分開的。頁面內容(HTML代碼)位于自身的HTML文件中,而定義代碼表現形式的CSS規(guī)則位于另一個文件(外部樣式表)或HTML文檔的另一部分(通常為
部分)中。使用CSS可以非常靈活并更好地控制頁面的外觀,從精確的布局定位到特定的字體和樣式等。術語“層疊”是指對同一個元素或Web頁面應用多個樣式的能力。例如,可以創(chuàng)建一個CSS規(guī)則來應用顏色,創(chuàng)建另一個規(guī)則來應用邊距,然后將兩者應用于一個頁面中的同一文本。所定義的樣式
2、“層疊”到您的Web頁面上的元素,并最終創(chuàng)建您想要的設計。CSS樣式表的創(chuàng)建,可以統(tǒng)一定制網頁文字的大小、字體、顏色、邊框、鏈接狀態(tài)等效果。在Dreamweaver8中CSS樣式的設置方式有了很大的改進,更為方便、實用、快捷。一、創(chuàng)建CSS樣式1、選中菜單“窗口”>“CSS樣式”。打開CSS樣式面板。2、單擊“CSS樣式”面板右下角的“新建CSS規(guī)則”按鈕,打開“新建CSS規(guī)則”對話框。在“選擇器類型”選項中,可以選擇創(chuàng)建CSS樣式的方法包括以下三種:類:我們可以在文檔窗口的任何區(qū)域或文本中應用類樣式,如果將類樣式應用于一整段文字,那么會在相應的標簽中出現CLASS屬性,該屬性值即為
3、類樣式的名稱。標簽(重新定義特定標簽的外觀):重新定義HTML標記的的默認格式。我們可以針對某一個標簽來定義層疊樣式表,也就是說定義的層疊樣式表將只應用于選擇的標簽。例如,我們?yōu)?body>和標簽定義了層疊樣式表,那么所有包含在
和標簽的內容將遵循定義的層疊樣式表。高級(ID、偽類選擇器等):為特定的組合標簽定義層疊樣式表,使用ID作為屬性,以保證文檔具有唯一可用的值。高級樣式是一種特殊類型的樣式,常用的有4種:a:link設定正常狀態(tài)下鏈接文字的樣式。a:active設定鼠標單擊時鏈接的外觀。a:visited設定訪問過的鏈接的外觀。a:hov
4、er設定鼠標放置在鏈接文字之上時,文字的外觀。3、為新建CSS樣式輸入或選擇名稱、標記或選擇器,其中:對于自定義樣式,其名稱必須以點(.)開始,如果沒有輸入該點,則DW回自動添加上。自定義樣式名可以是字母與數字的組合,但.之后必須是字母。對于重新定義HTML標記,可以在“標簽”下拉列表中輸入或選擇重新定義的標記。對于CSS選擇器樣式,可以在“選擇器”下拉列表中輸入或選擇需要的選擇器。4、在“定義在”區(qū)域選擇定義的樣式位置,可以是“新建樣式表文件”或“僅對該文檔”。單擊“確定”按鈕,如果選擇了“新建樣式表文件”選項,回彈出“保存樣式表文件為”對話框,給樣式表命名,保存后,回彈出“CSS
5、規(guī)則定義”對話框。如果選擇了“僅對該文檔”,則單擊“確定”后,直接彈出“CSS規(guī)則定義”,在其中設置CSS樣式。5、“CSS規(guī)則定義”對話框中設置CSS規(guī)則定義。主要分為類型、背景、區(qū)塊、方框、邊框、列表、定位和擴展8項。每個選項都可以對所選標簽做不同方面的定義,可以根據需要設定。定義完畢后,單擊“確定”按鈕,完成創(chuàng)建CSS樣式。1)、文本樣式的設置新建CSS樣式,“選擇器類型”為類,名稱為“style1”定義在“僅對該文檔”。保存至站點根目錄下的CSS文件夾內,彈出“CSS規(guī)則定義”對話框,默認顯示的就是對文本進行設置的“類型”項。字體:可以在下拉菜單種選擇相應的字體。大?。捍笮【?/p>
6、是字號,可以直接填入數字,然后選擇單位。樣式:設置文字的外觀,包括正常、斜體、偏斜體。行高:這項設置在網頁制作種很常用。設置行高,可以選擇“正?!?,讓計算機自動調整行高,也可以使用數值和單位結合的形式自行設置。需要注意的是,單位應該和文字的單位一致,行高的數值是包括字號數值在內的。例如,文字設置為12pt,如果要創(chuàng)建一倍行距,則行高應該為24pt。變體:在英文中,大寫字母的字號一般比較大,采用“變體”中的“小型大寫字母”設置,可以縮小大寫字母。顏色:設置文字的色彩。2)、背景樣式的設置在HTML中,背景只能使用單一的色彩或利用圖像水平垂直方向的平鋪。使用CSS之后,有了更加靈活的設置
7、。在“CSS規(guī)則定義”對話框左側選擇“背景”項,可以在右邊區(qū)域設置CSS樣式的背景格式。背景顏色:選擇固定色作為背景。背景圖像:直接填寫背景圖像的路徑,或單擊“瀏覽”按鈕找到背景圖像的位置。重復:在使用圖像作為背景的時,可以使用此項設置背景圖像的重復方式,包括“不重復”、“重復”、“橫向重復”、和“縱向重復“。附件:選擇圖像做背景的時候,可以設置圖像是否跟隨網頁一同滾動。水平位置:設置水平方向的位置,可以“左對齊”、“右對齊”、“居中”。還可以設置數值與單