資訊專(zhuān)欄INFORMATION COLUMN
摘要：前段時(shí)間在項(xiàng)目中遇到過(guò)自定義鼠標(biāo)圖標(biāo)這一需求。圖標(biāo)的大小鼠標(biāo)圖標(biāo)的尺寸推薦，否則可能出現(xiàn)大小不一致問(wèn)題。附上屬性值值描述需使用的自定義光標(biāo)的。
前段時(shí)間在項(xiàng)目中遇到過(guò) 自定義鼠標(biāo)圖標(biāo) 這一需求。由于一般我們用的鼠標(biāo)樣式大都是固定的幾種，而 自定義鼠標(biāo)圖標(biāo) 不是很常用到，所以對(duì)這一小知識(shí)點(diǎn)進(jìn)行總結(jié)，以防忘記。
自定義鼠標(biāo)圖標(biāo)自定義鼠標(biāo)圖標(biāo) 即 css cursor url的使用。
css:{cursor:url("圖標(biāo)路徑"),auot};
//IE，F(xiàn)F，chrome瀏覽器都可以
示例代碼：
解析：前面的url是自定義鼠標(biāo)圖標(biāo)的路徑，可以為相對(duì)/絕對(duì)路徑。第二個(gè)參數(shù)是css標(biāo)準(zhǔn)的cursor樣式?？蓳Q成其他屬性（如pointer/default/等）
注意：w3school推薦第二個(gè)參數(shù)必須定義一個(gè)普通的光標(biāo)，以防止url定義的光標(biāo)有備用選項(xiàng)。另外，IE下第二個(gè)參數(shù)可以省略。
圖標(biāo)的格式
IE支持cur,ani,ico這三種格式，F(xiàn)F支持bmp,gif,jpg,cur,ico這幾種格式，不支持ani格式，也不支持gif動(dòng)畫(huà)格式，因此一般將url引用的圖標(biāo)存為ico或cur格式比較好。
圖標(biāo)的大小
鼠標(biāo)圖標(biāo)的尺寸推薦32*32，否則可能出現(xiàn)大小不一致問(wèn)題。
附上cursor屬性值
| 值 | 描述 |
|---|---|
| url | 需使用的自定義光標(biāo)的URL。（注釋?zhuān)赫?qǐng)?jiān)诖肆斜淼哪┒艘欢ㄒ环N普通的光標(biāo)，以防沒(méi)有由URL定義的可用光標(biāo)。） |
| default | 默認(rèn)光標(biāo)(通常是一個(gè)箭頭) |
| auto | 默認(rèn)。瀏覽器設(shè)置的光標(biāo) |
| crosshair | 光標(biāo)呈現(xiàn)十字線(xiàn) |
| pointer | 光標(biāo)呈現(xiàn)為只是鏈接的指針（一只手） |
| move | 此光標(biāo)只是某對(duì)象可以被移動(dòng) |
| e-resize | 此光標(biāo)指示就行框的邊緣可以被向右（東）移動(dòng) |
| ne-resize | 此光標(biāo)指示就行框的邊緣可以被向上以及向右移動(dòng)（北/東） |
| nw-resize | 此光標(biāo)指示矩形框的邊緣可被向上及向左移動(dòng)（北/西）。 |
| n-resize | 此光標(biāo)指示矩形框的邊緣可被向上（北）移動(dòng)。 |
| se-resize | 此光標(biāo)指示矩形框的邊緣可被向下及向右移動(dòng)（南/東）。 |
| sw-resize | 此光標(biāo)指示矩形框的邊緣可被向下及向左移動(dòng)（南/西）。 |
| s-resize | 此光標(biāo)指示矩形框的邊緣可被向下移動(dòng)（北/西）。 |
| w-resize | 此光標(biāo)指示矩形框的邊緣可被向左移動(dòng)（西）。 |
| text | 此光標(biāo)指示文本 |
| wait | 此光標(biāo)指示程序正忙（通常一直表或者沙漏） |
| help | 此光標(biāo)指示可用的幫助（通常是一個(gè)問(wèn)號(hào)或氣球） |
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/115692.html
摘要：宋體中鏈接的使用宋體中光標(biāo)的使用宋體中宋體的使用宋體中縮放的使用宋體中鏈接的使用超鏈接偽類(lèi)屬性宋體表示該超鏈接文字尚未被點(diǎn)選宋體表示該超鏈接文字已被點(diǎn)選過(guò)宋體表示該超鏈接文字正被點(diǎn)選宋體但未被放開(kāi)宋體表示當(dāng)鼠標(biāo)停留1.CSS 中鏈接的使用 2.CSS 中光標(biāo)的使用 3.CSS 中 DHTML 的使用 4.CSS 中縮放的使用 1 18 8. .1 1 S CSS ?中 鏈接的使用 超鏈接偽類(lèi)...
摘要：設(shè)置縮放比例的構(gòu)造函數(shù)還可以傳入第三個(gè)參數(shù)，這個(gè)可選的參數(shù)用來(lái)確保使用的坐標(biāo)將匹配畫(huà)布的縮放像素坐標(biāo)。將其設(shè)置為將再次啟用拖動(dòng)。 說(shuō)明 Pixi 內(nèi)置一組功能有限的用于鼠標(biāo)交互和觸摸交互的方法，但是對(duì)于游戲和應(yīng)用程序所需的豐富交互性，建議使用第三方庫(kù)來(lái)簡(jiǎn)化操作，這篇文章介紹的是 Tink 庫(kù)，它有通用的指針對(duì)象、拖放精靈、按鈕對(duì)象、鍵盤(pán)控制 等一些有用的功能。 使用 Tink 庫(kù) 要...
摘要：如果你想讓你的網(wǎng)站看起來(lái)更酷炫，可以改變鼠標(biāo)樣式，用你喜歡的圖片來(lái)代替。圖片地址備用選項(xiàng)。 如果你想讓你的網(wǎng)站看起來(lái)更酷炫，可以改變鼠標(biāo)樣式，用你喜歡的圖片來(lái)代替。 下面就來(lái)介紹下步驟方法： 首頁(yè)把鼠標(biāo)圖標(biāo)格式轉(zhuǎn)換成.ico格式，大小為32*32轉(zhuǎn)換格式網(wǎng)址為：https://www.easyicon.net/covert/ 然后在CSS樣式中增加代碼： *{ cursor:u...
摘要：如果你想讓你的網(wǎng)站看起來(lái)更酷炫，可以改變鼠標(biāo)樣式，用你喜歡的圖片來(lái)代替。圖片地址備用選項(xiàng)。 如果你想讓你的網(wǎng)站看起來(lái)更酷炫，可以改變鼠標(biāo)樣式，用你喜歡的圖片來(lái)代替。 下面就來(lái)介紹下步驟方法： 首頁(yè)把鼠標(biāo)圖標(biāo)格式轉(zhuǎn)換成.ico格式，大小為32*32轉(zhuǎn)換格式網(wǎng)址為：https://www.easyicon.net/covert/ 然后在CSS樣式中增加代碼： *{ cursor:u...
閱讀 1752·2023-04-26 02:30
閱讀 1085·2021-11-10 11:36
閱讀 1425·2021-10-08 10:14
閱讀 3556·2021-09-28 09:35
閱讀 1586·2021-08-23 09:47
閱讀 2590·2019-08-30 15:56
閱讀 1511·2019-08-30 15:44
閱讀 1810·2019-08-30 13:59
