logo-tworzenie-stron-legnica

config

Style CSS

Spis alfabetyczny stylów CSS.

Ściąga CSS - przykłady, style CSS alfabetycznie, spis stylów CSS, właściwości CSS, skorowidz stylów CSS.


 

Strona w trakcie modernizacji

Zapraszamy wkrótce

Właściwość CSS cursor

Definicja stylu, przeznaczenie i użycie cursor

Styl określa wygląd kursora myszy, który jest wyświetlany podczas wskazywania elementu.

Wartości właściwości cursor

Wartość Opis
alias Kursor wskazuje alias czegoś, co ma zostać utworzone.
all-scroll Kursor wskazuje, że element można przewijać w dowolnym kierunku.
auto Wqartość domyślna. Przeglądarka ustawia kursor.
cell Kursor wskazuje, że można wybrać komórkę (lub zestaw komórek).
context-menu Kursor wskazuje, że dostępne jest menu kontekstowe.
col-resize Kursor wskazuje, że rozmiar kolumny można zmienić w poziomie.
copy Kursor wskazuje, że element można skopiować.
crosshair Kursor ma kształt celownika (kształt crosshair).
default Domyślny kursor.
e-resize Kursor wskazuje, że krawędź pola ma zostać przesunięta w prawo (ang. east – wschód).
ew-resize Wskazuje dwukierunkowy kursor zmiany rozmiaru (ang. east – wschód, west – zachód).
grab Kursor wskazuje, że można coś chwycić myszką.
grabbing Kursor wskazuje, że można coś chwycić myszką.
help Kursor wskazuje, że dostępna jest pomoc.
move Kursor wskazuje, że element może zostać przesunięty.
n-resize Kursor wskazuje, że krawędź pola ma zostać przesunięta w górę (ang. nord – północ)
ne-resize Kursor wskazuje, że krawędź pola ma zostać przesunięta w górę i w prawo (ang. nord – północ, east – wschód)
nesw-resize Kursor wskazuje wielokierunkową możliwość zmiany rozmiaru (ang. nord – północ, east – wschód, south – południe, west – zachód).
ns-resize Wskazuje dwukierunkowy kursor zmiany rozmiaru (ang. nord – północ, south – południe)
nw-resize Kursor wskazuje, że element może zostać przesunięty w górę i w lewo (ang. nord – północ, west – zachód)
nwse-resize Wskazuje wielokierunkową możliwość zmiany rozmiaru elementu (ang. nord – północ, west – zachód, south – południe, east – wschód).
no-drop Kursor wskazuje, że przeciąganego elementu nie można tu upuścić.
none Kursor nie jest renderowany dla elementu.
not-allowed Kursor wskazuje, że żądana akcja nie może zostać wykonana.
pointer Kursor ma wygląd wskaźnika (pointer) i wskazuje łącze.
progress Kursor wskazuje, że program jest zajęty (w toku).
row-resize Kursor wskazuje, że rozmiar rzędu (row) można zmienić w pionie.
s-resize Kursor wskazuje, że krawędź pola ma zostać przesunięta w dół (ang. south – na południe)
se-resize Kursor wskazuje, że krawędź pola ma zostać przesunięta w dół i w prawo (ang. south – południe, east – wschód).
sw-resize Kursor wskazuje, że krawędź pola ma zostać przesunięta w dół i w lewo (ang. south – południe, west – zachód).
text Kursor wskazuje tekst, który można zaznaczyć.
URL Lista adresów URL oddzielonych przecinkami do niestandardowych kursorów. Uwaga: zawsze określaj ogólny kursor na końcu listy, na wypadek gdyby nie można było użyć żadnego z kursorów zdefiniowanych w adresie URL.
vertical-text Kursor wskazuje tekst pionowy, który można zaznaczyć.
w-resize Kursor wskazuje, że krawędź pola można przesunąć w lewo (ang. west – na zachód).
wait Kursor wskazuje, że program jest zajęty i należy czekać.
zoom-in Kursor wskazuje, że element można zwiększyć.
zoom-out Kursor wskazuje, że element można zmniejszyć.
initial Ustawia tę właściwość na jej wartość domyślną.
inherit Dziedziczy tę właściwość z elementu nadrzędnego.

Składnia CSS cursor

cursor: value;

Wsparcie przeglądarek dla właściwości cursor

Liczba w tabeli określa pierwszą wersję przeglądarki w pełni obsługującą tę właściwość.

Właściwość chrome edge firefox safari opera
cursor 5.0 5.5 4.0 5.0 9.6

 

Przykładowe zastosowania z właściwością cursor

Kliknij wartości właściwości poniżej, aby zobaczyć wynik.

Właściwość CSS:
cursor:

 
Rezultat:

Najedź myszką na ten obszar, aby zobaczyć zmienny kształt kursora.

Kod CSS:
div {
    cursor:auto;
}
 

 

Przykłady właściwości cursor

{cursor: alias;}
{cursor: all-scroll;}
{cursor: auto;}
{cursor: cell;}
{cursor: context-menu;}
{cursor: col-resize;}
{cursor: copy;}
{cursor: crosshair;}
{cursor: default;}
{cursor: e-resize;}
{cursor: ew-resize;}
{cursor: grab;}
{cursor: grabbing;}
{cursor: help;}
{cursor: move;}
{cursor: n-resize;}
{cursor: ne-resize;}
{cursor: nesw-resize;}
{cursor: ns-resize;}
{cursor: nw-resize;}
{cursor: nwse-resize;}
{cursor: no-drop;}
{cursor: none;}
{cursor: not-allowed;}
{cursor: pointer;}
{cursor: progress;}
{cursor: row-resize;}
{cursor: s-resize;}
{cursor: se-resize;}
{cursor: sw-resize;}
{cursor: text;}
{cursor: url(myBall.cur),auto;}
{cursor: w-resize;}
{cursor: wait;}
{cursor: zoom-in;}
{cursor: zoom-out;}

 

Witold Czuba Tworzenie stron Warszawa, Wrocław i Legnica | Grafik | Strony , , Marynarska 54, 59-220, Legnica, dolnośląskie, Polska, tel. +48 780 060 995, Pon. - pt. 8:00 - 17:00

 

 

Witold Czuba

Tworzenie stron Warszawa, Wrocław i Legnica | Grafik | Strony

Marynarska 54
59-220, Legnica,
dolnośląskie, Polska,
tel. +48 780 060 995,
Pon. - pt. 8:00 - 17:00