建站
咨詢
售后
建站咨詢
新聞中心
I的樣子；當(dāng)鼠標(biāo)指向鏈接時，鼠標(biāo)會變成一個小手的形狀等。
成都創(chuàng)新互聯(lián)于2013年成立，是專業(yè)互聯(lián)網(wǎng)技術(shù)服務(wù)公司，擁有項(xiàng)目網(wǎng)站設(shè)計(jì)制作、成都網(wǎng)站建設(shè)網(wǎng)站策劃，項(xiàng)目實(shí)施與項(xiàng)目整合能力。我們以讓每一個夢想脫穎而出為使命，1280元合山做網(wǎng)站,已為上家服務(wù),為合山各地企業(yè)和個人服務(wù),聯(lián)系電話:13518219792
除了這些默認(rèn)的變化外，您還可以通過 CSS 中的 cursor 屬性來改變網(wǎng)頁中鼠標(biāo)（光標(biāo)）的樣式，下表中列舉了 cursor 屬性的可選值：
table img {vertical-align:middle;}
| 屬性值 | 示意圖 | 描述 |
|---|---|---|
| auto | 默認(rèn)值，由瀏覽器根據(jù)當(dāng)前上下文確定要顯示的光標(biāo)樣式 | |
| default | 默認(rèn)光標(biāo)，不考慮上下文，通常是一個箭頭 | |
| none | 不顯示光標(biāo) | |
| initial | 將此屬性設(shè)置為其默認(rèn)值 | |
| inherit | 從父元素基礎(chǔ) cursor 屬性的值 | |
| context-menu | 表示上下文菜單可用 | |
| help | 表示有幫助 | |
| pointer | 表示一個鏈接 | |
| progress | 進(jìn)度指示器，表示程序正在執(zhí)行一些處理，但是您仍然可以在該界面進(jìn)行一些操作（與 wait 不同） | |
| wait | 表示程序繁忙，您應(yīng)該等待程序指向完成 | |
| cell | 表示可以選擇一個單元格（或一組單元格） | |
| crosshair | 一個簡單的十字準(zhǔn)線 | |
| text | 表示可以選擇的文本 | |
| vertical-text | 表示可以選擇的垂直文本 | |
| alias | 表示要創(chuàng)建別名或快捷方式 | |
| copy | 表示可以復(fù)制某些內(nèi)容 | |
| move | 表示可以移動鼠標(biāo)下方的對象 | |
| no-drop | 表示所拖動的項(xiàng)目不能放置在當(dāng)前位置 | |
| not-allowed | 表示無法完成某事 | |
| all-scroll | 表示對象可以沿任何方向滾動（平移） | |
| col-resize | 表示可以水平調(diào)整列的大小 | |
| row-resize | 表示可以垂直調(diào)整行的大小 | |
| n-resize | 表示對象的邊緣可以向上（向北）移動 | |
| e-resize | 表示對象的邊緣可以向右（向東）移動 | |
| s-resize | 表示對象的邊緣可以向下（向南）移動 | |
| w-resize | 表示對象的邊緣可以向左（向西）移動 | |
| ne-resize | 表示對象的邊緣可以向上和向右（北/東）移動 | |
| nw-resize | 表示對象的邊緣可以向上和向左（北/西）移動 | |
| se-resize | 表示對象的邊緣可以向下和向右（向南/向東）移動 | |
| sw-resize | 表示對象的邊緣可以向下和向左（南/西）移動 | |
| ew-resize | 表示可以雙向調(diào)整對象大小的光標(biāo) | |
| ns-resize | ||
| nesw-resize | ||
| nwse-resize | ||
| zoom-in | 表示可以放大某些內(nèi)容 | |
| zoom-out | 表示可以縮小某些內(nèi)容 | |
| grab | 表示可以抓?。ㄍ蟿樱┠承〇|西 | |
| grabbing | 表示已經(jīng)抓取到某些東西 | |
| url("") | 自定義光標(biāo)的樣式，括號中的內(nèi)容為光標(biāo)圖像的源文件路徑 |
提示：由于計(jì)算機(jī)系統(tǒng)的不同，鼠標(biāo)的樣式會存在一定的差異。
【示例】使用 cursor 屬性設(shè)置網(wǎng)頁中光標(biāo)的樣式：
cursor: cell;
cursor: crosshair;
cursor: text;
cursor: vertical-text;
cursor: alias;
cursor: copy;
cursor: move;
cursor: no-drop;
運(yùn)行上面的代碼，然后將鼠標(biāo)指向不同的 HTML 元素，可以發(fā)現(xiàn)當(dāng)指向不同的元素時鼠標(biāo)的樣式也會發(fā)生相應(yīng)的改變。
自定義光標(biāo)樣式
除了可以使用上表中介紹的光標(biāo)樣式外，您也可以使用圖像文件來自定義光標(biāo)的樣式，如下所示：
cursor: url("custom.gif"), url("custom.cur"), default;
您可以使用 url() 定義多個光標(biāo)的樣式文件，每個 url() 之間使用逗號
,分隔，上面示例中 custom.gif、custom.cur 就是自定義的光標(biāo)文件。需要注意的是，在自定義光標(biāo)樣式時，要在最后定義一個上表中的通用光標(biāo)樣式，防止使用 url() 中定義的光標(biāo)圖像資源失效。
提示：.cur 格式是光標(biāo)文件的標(biāo)準(zhǔn)格式，您可以使用一些在線工具（例如 https://convertio.co/zh/cur-converter/）將 .jpg、.gif 等格式的圖像文件轉(zhuǎn)換為 .cur 格式。
當(dāng)前名稱：CSScursor（鼠標(biāo)樣式）
本文網(wǎng)址：http://fisionsoft.com.cn/article/djgghdd.html
