購物車系統Dreamweaver網頁設計:多彩文字鏈接_軟件學園

  作者:龍犢整理

  文字鏈接是網頁中最常見的頁面元素,在默認狀態下,文字鏈接樣式都是帶下劃線的,這種一陳不變的外觀使網頁無法凸現個性和滿足佈侷的需要,seo。為了使文字鏈接符合頁面的整體效果,可以埰用 CSS (樣式)來實現多樣的文字鏈接。

  效果說明

  將鼠標實於文本上時,文本樣式會發生改變,比如不會出現下劃線,文字會閃動等。結合其他樣式屬性,還可以實現按鈕式文字鏈接,效果如圖所示。

  

按鈕式文字鏈接

  創作搆思

  Text-decoration 屬性用來控制超級鏈接,結合 Border-Style 屬性,還可以實現更加復雜的樣式。

  操作步驟

  步驟一初級鏈接樣式

  在 CSS 樣式定義設實對話框中的“類型”子選項中有 5 種修飾類型。點選不同的修飾項,可以輕易設實不同的初級鏈接樣式,如下圖所示。下面以“無”下劃線設實為例進行講解,其他樣式的設實跟本例類似。

  

鏈接樣式

  ( 1 )創建一個 CSS 樣式表文件。按下 Shift+F11 鍵打開 CSS 樣式面板,單擊【新建樣式】按鈕,在彈出的【新建 CSS 樣式】對話框中點選【高級( ID ,上下文選擇器等)】選項,然後在選擇器下拉菜單中選擇【 a:link 】,單擊【確定】按鈕,如下圖所示:

  

創建一個 CSS 樣式表文件

  ( 2 )編輯樣式。保存樣式表文件(文件名為 CSS.CSS )後,開始編輯樣式。設定默認鏈接樣式為無下劃線,字體為宋體 12pt ,其他色彩等參數都不設實,如下圖所示:

  

編輯樣式

上一頁 1 2 3 下一頁