Kurzor - CSS-trükkök

Anonim

A cursorCSS tulajdonság vezérli, hogy fog kinézni az egér kurzor, amikor az az elem felett helyezkedik el, amelyben ez a tulajdonság be van állítva. Nyilvánvaló, hogy csak azokban a böngészőkben / operációs rendszerekben releváns, amelyekben egér és kurzor található. Lényegében az UX-hez használják, hogy közvetítsék bizonyos funkcionalitás gondolatait. Ezért próbáld meg nem törni ezt a megfizethetőséget.

Van egy csomó közülük:

.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; )

A kurzor kép is lehet:

.custom ( cursor: url(images/my-cursor.png.webp), auto; )

Néhány WebKit csak kurzor:

-webkit-zoom-in -webkit-zoom-out -webkit-zoom-grab -webkit-zoom-grabbing

Több információ

  • CSS Basic felhasználói felület modul, 3. szint
  • Mozilla Docs

Böngésző támogatás

Ez a böngésző támogatási adat a Caniuse cégtől származik, amely részletesebben szerepel. Egy szám azt jelzi, hogy a böngésző támogatja az adott és újabb verziók szolgáltatásait.

Asztal

Króm Firefox AZAZ Él Szafari
5. 4 9. 14 5.

Mobil / Tablet

Android Chrome Android Firefox Android iOS Safari
88 Nem 81. Nem

És az újabb értékeket, például zoom-inés zoom-out:

Ez a böngésző támogatási adat a Caniuse cégtől származik, amely részletesebben szerepel. Egy szám azt jelzi, hogy a böngésző támogatja az adott és újabb verziók szolgáltatásait.

Asztal

Króm Firefox AZAZ Él Szafari
4 * 2 * Nem 12. 3,1 *

Mobil / Tablet

Android Chrome Android Firefox Android iOS Safari
88 Nem 81. Nem