Den cursorejendom i CSS kontroller hvad musemarkøren vil se ud, når den er placeret over elementet, hvor denne egenskab er indstillet. Det er åbenbart kun relevant i browsere / operativsystemer, hvor der er en mus og en markør. De bruges hovedsageligt til UX til at formidle ideen om visse funktioner. Så prøv ikke at bryde den overkommelighed.
Der er en masse af dem:
.auto ( cursor: auto; ) .default ( cursor: default; ) .none ( cursor: none; ) .context-menu ( cursor: context-menu; ) .help ( cursor: help; ) .pointer ( cursor: pointer; ) .progress ( cursor: progress; ) .wait ( cursor: wait; ) .cell ( cursor: cell; ) .crosshair ( cursor: crosshair; ) .text ( cursor: text; ) .vertical-text ( cursor: vertical-text; ) .alias ( cursor: alias; ) .copy ( cursor: copy; ) .move ( cursor: move; ) .no-drop ( cursor: no-drop; ) .not-allowed ( cursor: not-allowed; ) .all-scroll ( cursor: all-scroll; ) .col-resize ( cursor: col-resize; ) .row-resize ( cursor: row-resize; ) .n-resize ( cursor: n-resize; ) .e-resize ( cursor: e-resize; ) .s-resize ( cursor: s-resize; ) .w-resize ( cursor: w-resize; ) .ns-resize ( cursor: ns-resize; ) .ew-resize ( cursor: ew-resize; ) .ne-resize ( cursor: ne-resize; ) .nw-resize ( cursor: nw-resize; ) .se-resize ( cursor: se-resize; ) .sw-resize ( cursor: sw-resize; ) .nesw-resize ( cursor: nesw-resize; ) .nwse-resize ( cursor: nwse-resize; )Markøren kan også være et billede:
.custom ( cursor: url(images/my-cursor.png.webp), auto; )Nogle WebKit markører kun:
-webkit-zoom-in -webkit-zoom-out -webkit-zoom-grab -webkit-zoom-grabbingMere information
- CSS Basic User Interface Module niveau 3
- Mozilla Docs
Browsersupport
Denne browsersupportdata er fra Caniuse, som har flere detaljer. Et tal angiver, at browseren understøtter funktionen i den version og opefter.
Desktop
| Chrome | Firefox | IE | Edge | Safari |
|---|---|---|---|---|
| 5 | 4 | 9 | 14 | 5 |
Mobil / tablet
| Android Chrome | Android Firefox | Android | iOS Safari |
|---|---|---|---|
| 88 | Ingen | 81 | Ingen |
Og for nyere værdier, som zoom-inog zoom-out:
Denne browsersupportdata er fra Caniuse, som har flere detaljer. Et tal angiver, at browseren understøtter funktionen i den version og opefter.
Desktop
| Chrome | Firefox | IE | Edge | Safari |
|---|---|---|---|---|
| 4 * | 2 * | Ingen | 12 | 3.1 * |
Mobil / tablet
| Android Chrome | Android Firefox | Android | iOS Safari |
|---|---|---|---|
| 88 | Ingen | 81 | Ingen |