CSS一些有趣的东西
生活随笔
收集整理的這篇文章主要介紹了
CSS一些有趣的东西
小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
w3cschool摘錄,供自己學(xué)習(xí)用。
css cursor屬性
定義和用法
cursor 屬性規(guī)定要顯示的光標(biāo)的類型(形狀)。
實(shí)例
一些不同的光標(biāo):
<html><body>
<p>請(qǐng)把鼠標(biāo)移動(dòng)到單詞上,可以看到鼠標(biāo)指針發(fā)生變化:</p>
<span style="cursor:auto">
Auto</span><br />
<span style="cursor:crosshair">
Crosshair</span><br />
<span style="cursor:default">
Default</span><br />
<span style="cursor:pointer">
Pointer</span><br />
<span style="cursor:move">
Move</span><br />
<span style="cursor:e-resize">
e-resize</span><br />
<span style="cursor:ne-resize">
ne-resize</span><br />
<span style="cursor:nw-resize">
nw-resize</span><br />
<span style="cursor:n-resize">
n-resize</span><br />
<span style="cursor:se-resize">
se-resize</span><br />
<span style="cursor:sw-resize">
sw-resize</span><br />
<span style="cursor:s-resize">
s-resize</span><br />
<span style="cursor:w-resize">
w-resize</span><br />
<span style="cursor:text">
text</span><br />
<span style="cursor:wait">
wait</span><br />
<span style="cursor:help">
help</span>
</body>
</html>
通過(guò)HTML DOM course屬性也可以實(shí)現(xiàn)這個(gè)效果:
語(yǔ)法:
Object.style.cursor=cursortype實(shí)例
本例改變指針:
<html><head>
<script type="text/javascript">
function changeCursor()
{
document.body.style.cursor="crosshair";
document.getElementById("p1").style.cursor="text";
}
</script>
</head>
<body>
<p id="p1">This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text.</p>
<input type="button" onclick="changeCursor()"
value="Change cursor" />
</body>
</html>
轉(zhuǎn)載于:https://www.cnblogs.com/xinyebabao/archive/2011/06/22/2034932.html
總結(jié)
以上是生活随笔為你收集整理的CSS一些有趣的东西的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: 关于SharePoint中管理列表项权限
- 下一篇: CSS 锦囊[收藏]