入門學習:運用CSS樣式表改變滑鼠的樣式

來源:互聯網
上載者:User
css|滑鼠|樣式表

  用慣了Windows的人對各種各樣的滑鼠樣式一定不會陌生。當滑鼠移動到不同的地方時,當滑鼠執行不同的功能時,當系統處於不同的狀態時,都會使滑鼠的形狀發生變化。而在網頁上往往只有當滑鼠在超級連結上時才出現一個手形,在其它地方似乎沒有什麼變化。這同充滿動感的網頁顯得不怎麼和諧。實際上,用CSS可以方便地定義許多種滑鼠形狀。用本文介紹的方法,可以在網頁的作何地方設定滑鼠的不同樣式。

  在Dreamweaver3中設定手形滑鼠樣式效果的製作步驟:

  1、按F7(或點擊快速啟動欄裡那個象“八卦圖”似的表徵圖),調出CSS面板,選擇“none”,再點擊面板下部的編輯表徵圖,在彈出的“Edit Style Sheet”對話方塊上按“New”按鈕,在彈出的“New Style”對話方塊中選擇“Make Custom Style (加到網頁的原始碼中去才行。

  若要把滑鼠改變成其它形狀,只要在第二步中定義“cursor”屬性時選擇不同的樣式就行了。各屬性值的含義如下:

crosshair:精確定位“十”字形;
text:文本“I”形;
wait:等待,“沙漏”形;
default:預設指標;
help:協助,帶尾箭頭;
e-resize:箭頭朝右方;
ne-resize:箭頭朝右上方;
n-resize:箭頭朝上方;
nw-resize:箭頭朝左上方;
w-resize:箭頭朝左方;
sw-resize:箭頭朝左下方;
s-resize:箭頭朝下方;
se-resize箭頭朝右下方;
auto:自動,滑鼠按照預設的狀態根據頁面上的元素自行改變樣式。

  瞭解了上述屬性值的含義,滑鼠的形狀就在你的掌握之中了,需要讓滑鼠在那裡變為什麼形狀,只要重複上面的操作就行了。要注意的是:一次只能定義一種滑鼠樣式,若在一個頁面上使用多種樣式的滑鼠圖形,要定義多個“class",用時選擇載入。



相關文章

Beyond APAC's No.1 Cloud

19.6% IaaS Market Share in Asia Pacific - Gartner IT Service report, 2018

Learn more >

Apsara Conference 2019

The Rise of Data Intelligence, September 25th - 27th, Hangzhou, China

Learn more >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。