在CSS中,使用cursor屬性來定義鼠標的樣式。
語法:
cursor:屬性值;
說明:
cursor屬性取值如下,默認值為default。大家可能會驚呆,我暈,cursor屬性值這麼多,怎麼記呀?其實大家不用擔心,在實際開發中,我們一般只用到“default”和“pointer”這兩個屬性值,其他的一般都很少用得上。如果實在沒辦法還需要其他的,那就回來查這種表就行了。
舉例:
在線測試
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>cursor屬性</title>
<style type="text/css">
div
{
width:100px;
height:30px;
line-height:30px;
text-align:center;
border:1px solid #CCCCCC;
background-color: #40B20F;
color:white;
font-size:14px;
font-weight:bold;
}
#div_default{cursor:default;}
#div_pointer{cursor:pointer;}
</style>
</head>
<body>
<div id="div_default">鼠標默認樣式</div>
<div id="div_pointer">鼠標手狀樣式</div>
</body>
</html>
在浏覽器預覽效果如下:
分析:
我們可以看到,默認情況下鼠標是斜箭頭。
大家請記住,一般情況下,我們只需要采用浏覽器默認的鼠標樣式就可以了,如果實在特別需要的時候可以用“cursor:pointer;”。對於cursor的其他屬性值,我們一般用不上。因此大家無需花力氣去記憶這些沒用的屬性。