Com definir l’aparença dels seus enllaços?
A la Web, els enllaços hipertex estan, tradicionalment, caracteritzats pel color blau i el subratllat. Però també us haureu fixat que aquesta presentació varia d’un lloc Web a un altre. Podeu fàcilment personalitzar l’aparença dels vostres enllaços amb els estils CSS. Aquí podem veure un exemple molt clàssic:
a { color: green; text-decoration: none; }
a:hover { color: red; text-decoration: underline; }- « a » tracta tots els enllaços mostrats a la vostra pàgina Web, és a dir totes les etiquetes <a>, sense excepció, tinguin o no un atribut class. En l’exemple que hi ha més amunt, els enllaços es mostraran en verd, sense «decoració»: no estan subratllats.
- Tenim diversos estats disponibles pels enllaços amb les «pseudo classes» (:hover, :visited, etc.). D’aquesta manera «a:hover» fa referència als enllaços «sobrevolats». En l’exemple que hi ha més amunt, els enllaços esdevenen vermells i subratllats quan se’ls passa el ratolí pel damunt.
Fixeu-vos que la recomanació CSS2 precisa que, per ser tinguda en compte plenament, la regla a:hover s’ha de col·locar després de les altres.
Els enllaços hipertext d’SPIP
SPIP 1.2, SPIP 1.2.1 va més enllà, permetent diferenciar gràficament els diferents tipus d’enllaços, sobretot els enllaços interns al llocs Web i els enllaços cap els altres llocs. Això es fa amb algunes definicions d’estil específiques, que us recomanem personalitzar al vostre gust:
- a.spip_in fa referència als enllaços a l’interior del vostre propi lloc Web. Per exemple:
La drecera [->article2224] genera un enllaç intern, cap a l’article 2224 del vostre lloc Web, d’aquesta manera: Els fulls d’estil d’SPIP
- a.spip_out fa referència als enllaços cap a l’exterior del vostre lloc Web. Per exemple:
La drecera
[uZine->http://www.uzine.net]mostra el següent enllaç extern: uZine
- a.spip_url tracta les adreces URL transformades en enllaç hipertext. Per exemple:
La drecera [->http://www.uzine.net] mostra directament el URL, amb un enllaç hipertext cap a aquesta adreça, d’aquesta manera: http://www.uzine.net
- a.spip_glossaire es refereix als enllaços cap el glossari extern (en aquesta ocasió l’enciclopèdia en línia Wikipédia). Per exemple :
La drecera [?SPIP] genera el següent enllaç: SPIP
Per no embolicar-se amb els enllaços
Fixeu-vos bé que, per un enllaç concret, hi intervenen moltes definicions d’estil . Per exemple, si preciseu:
a { color: green; text-decoration: underline; }
a.spip_in { color: orange; }Els enllaços interns (dotats de la categoria spip_in) són de color taronja, però hereten igualment el subratllat aplicat a <a>. Els altres enllaços, inclosos aquells que no són generats per SPIP, es mostraran de color verd subratllat.
Veiem aquí una propietat fonamental dels fulls d’estil: les regles gràfiques s’apliquen en l’ordre del més genèric al més específic. Això permet especificar un comportament general per la major part dels elements, i modificar aquest comportament per un subconjunt més petit d’elements. Aquesta característica és la que dóna tota la potència als fulls d’estil.
Remarcar l’enllaç activat
A partir d’SP<font
color="yellow">IP
1.7.1, es pot posar en evidència, en una llista d’enllaços, aquell que fa referència a la pàgina on ens trobem. L’estil que utilitzarem per fer això és: .on. Veure: «Remarcar un article en una llista».