Descriere: Pseudoclase de stiluri CSS si modalitati de modificare a cursorului
Download:
Autor: Anonim
Sursa (Link-ul oficial): Propria parere: Folositor.
Tutorialul:
Pseudoclasele se utilizează pentru personalizarea legăturilor web, atât de tip text, cât şi de tip imagine. Ele se definesc în interiorul unui bloc <style>...</style> sau într-un fişier extern.
Exemplul de mai jos este edificator în acest sens:
a: link {color: blue; font-size: 15pt;}
a: hover {color: red; font-style: italic; text-decoration: none}
a: visited {color: magenta; font-size: 15pt; text-decoration: none}
a: active {color: cyan; font-size: 15pt; text-decoration: none}
Explicaţii:
a: link se referă la modul în care arată un link în mod normal;
a: hover se referă la modul în care arată un link atunci când se trece cu mouse-ul peste el (în Netscape funcţionează doar de la versiunea 6);
a: active se referă la modul în care arată un link atunci când se efectuează click pe el;
a: visited se referă la modul în care arată un link deja vizitat;
specificaţia "text-decoration: none" elimină sublinierea implicită cu o linie albastră a link-ului.
Pentru ca numai anumite legături să utilizeze un stil, se pot folosi următoarele trei metode:
1. a: link.CLASA1 {...} combinat cu <a class = CLASA1 href=" "> ...</a>
2. a: link#ID1 {...} combinat cu <a id = ID1 href=" "> ...</a>
3. a.CLASA1: link {...} combinat cu <a class = CLASA1 href=" "> ...</a>
Chestiune Auxiliară
În browsere cursorul mouse-ului are în general o formă simplă şi binecunoscută, luând pe parcursul vizionării paginii respective maximum două înfăţişări diferite:
Mâna - atunci când este poziţinat pe o legătură
Săgeata oblică din direcţia dreapta jos spre stânga sus - atunci când este poziţionat pe alt obiect decât o legătură.
Acestea sunt însă formele implicite. Există însă şi cazuri în care am dori ca acel cursor să ia o altă formă decât cele două predefinite. La fel ca multe alte probleme care privesc modul în care arată o pagină, şi această problemă îşi găseşte rezolvarea în folosirea CSS ca limbaj de descriere a modului de stilizare a unui document.
Proprietatea care manipulează forma cursorului se numeşte simplu: "cursor" şi poate fi introdusă în orice element "style" al unui tag html.
De exemplu, pentru obţinerea unei imagini a cursorului de tipul unei săgeţi însoţite de un semn de întrebare la trecerea mouse-ului peste un link, iată codul care va trebui folosit:
<a href="fisier.html" style="cursor: help">Legatura</a>
Efectul este următorul (doar pentru IE minim 4.0):
Legatura cu CSS pentru stilizare cursor
Nu este însă unicul mod de stilizare a cursorului mouse-ului. În continuare prezentăm codurile pentru toate formele de cursor care se pot folosi:
Cod: Selectaţi tot
Auto utilizează setarile implicite ale utilizatorului
crosshair creează o cruce
default setările implicite ale browserului
e-resize săgeata Est-Vest
hand mână
help semnul întrebării
move cruce cu săgeţi la capete
n-resize săgeata sud-nord
ne-resize săgeata SudVest – Nord Est
nw-resize săgeata SudEst – NordVest
pointe rmână
s-resize săgeata Nord – Sud
se-resize săgeata NordVest – SudEsts
w-resize săgeata NordEst – SudVest
text bara verticală câmpuri de introducere a datelor
w-resize săgeata Est-Vest
wait clepsidra
