首頁 > web前端 > css教學 > 主體

css怎麼換滑鼠樣式

藏色散人
發布: 2018-12-06 09:13:39
原創
3942 人瀏覽過



滑鼠樣式常見的如箭頭或小手形狀,除此之外,我們可以根據我們自身的要求,使用css中cursor屬性來變更滑鼠遊標的外觀。

css怎麼換滑鼠樣式

推薦學習:《CSS教學

#下面我們就介紹滑鼠遊標的不同樣式。

程式碼如下:

<!DOCTYPE>
<html>
<meta charset="utf-8">
<head>
    <title></title>
</head>
<body>
<a href=# style=cursor:crosshair;>十字准线</a><hr>
<a href=# style=cursor:text;> text </a><hr>
<a href=# style=cursor:wait;>等待的形状</a><hr>
<a href=# style=cursor:move;>移动的形状</a><hr>
<a href=# style=cursor:help;>帮助的形状</a><hr>
<a href=# style=cursor:default;>默认的形状</a><hr>
<a href=# style=cursor:hand;>小手状</a>
</body>
</html>
登入後複製

上述程式碼,大家可以複製到本地進行測試,當滑鼠停留在每個超鏈上,就會顯示更改不同的遊標樣式。

十字線樣式:


css怎麼換滑鼠樣式

文本編輯時樣式:

css怎麼換滑鼠樣式

#等待樣式:

css怎麼換滑鼠樣式

移動樣式:

css怎麼換滑鼠樣式

幫助樣式:

css怎麼換滑鼠樣式

預設箭頭樣式:

css怎麼換滑鼠樣式

小手樣式:

css怎麼換滑鼠樣式

cursor屬性規定要顯示的遊標的類型(形狀)。此屬性定義了滑鼠指標放在一個元素邊界範圍內時所使用的遊標形狀(不過 CSS2.1 沒有定義由哪個邊界決定這個範圍)。

這篇文章就是關於css滑鼠遊標樣式的簡單介紹,希望對需要的朋友有幫助!



以上是css怎麼換滑鼠樣式的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板