- Home
- Categorie
- Coding e Sistemistica
- HTML e CSS
- Link di colore diverso per la pagina aperta
-
Link di colore diverso per la pagina aperta
Salve, mi si presenta il seguente problema...
Per assegnare ai link un colore ed un effetto al passaggio del mouse, da sempre utizzo, adattandolo, il seguente codice nel body della pagina.<style type="text/css"> <!-- h2 { color: #ffffff; font-family: Arial,Helvetica; font-size:12pt; } p,h1,h3,h4,ul,ol,li,div,td,th,adress,form { font-family: Arial,Helvetica; font-size:10pt; } input { font-family: Arial,Helvetica; font-size:10pt; } a:link { color: #ffff00; text-decoration: none; } a:visited { color:; text-decoration: none; } a:active { color:; text-decoration: none; } a:hover { color:; text-decoration: underline; } --> </style>
Nel tag body c'è anche:
text="#ffffff" link="#ffff00" vlink="#ffff00" alink="#ffff00"
Tutto funziona, però stavolta, per questioni di grafica, vorrei che il link della pagina che si sta visualizzando (il menù è riproposto in cima a tutte le pagine) fosse di un colore differente, ad esempio "#ccffff".
Fatto sta che io cambio "#ffff00" con "#ccffff" sia nel css che nel body in corrispondenza di a:active e alink, ma continuo a vedere i link tutti dello stesso colore giallo! L'unico effetto che funziona è la sottolineatura al passaggio del mouse.Dove sbaglio? Come posso fare per risolvere?
Grazie.
-
Ciao Gas75,
Le proprietà nel body non andrebbero usati, le dichiarazioni che fai nel foglio di stile sono sufficientiControlla che il colore non sia sovrascritto da qualche altra dichiarazione inline all'interno dei tag.
-
Rimuovendo le proprietà di testo dal body, e cambiando il codice css così:
<style type="text/css"> <!-- h2 { color: #ffffff; font-family: Arial,Helvetica; font-size:12pt; } p,h1,h3,h4,ul,ol,li,div,td,th,adress,form { font-family: Arial,Helvetica; font-size:10pt; } input { font-family: Arial,Helvetica; font-size:10pt; } a:link { color: #ffff00; text-decoration: none; } a:visited { color:; text-decoration: none; } a:active { color: #ccffff; text-decoration: none; } a:hover { color:; text-decoration: underline; } --> </style> ```non cambia niente. Può dipendere dal fatto che i link sono inseriti in un tag di questo tipo:
<div align="center" style="font-size:14pt"></div>
A me sembra strano perché lì metto solo allineamento e grandezza del font, quindi i link li formatta in base alle istruzioni generali.:?
-
Bisogna vedere se c'è qualche dichiarazione che va a sovrascrivere lo stile.
Di solito gli stili inline hanno la priorità più alta ma nel tuo caso non sembra esserci nessun conflitto.Non è che magari sono stati ri-dichiarati nella regola del div o addirittura nel body?
-
Osservazioni sensate, però la situazione integrale nella pagina è la seguente...
<body bgcolor="#00773e" text="#ffffff" topmargin="2" marginwidth="2" marginheight="0"> <style type="text/css"> <!-- h2 { color: #ffffff; font-family: Arial,Helvetica; font-size:12pt; } p,h1,h3,h4,ul,ol,li,div,td,th,adress,form { font-family: Arial,Helvetica; font-size:10pt; } input { font-family: Arial,Helvetica; font-size:10pt; } a:link { color: #ffff00; text-decoration: none; } a:visited { color:; text-decoration: none; } a:active { color: #ccffff; text-decoration: none; } a:hover { color:; text-decoration: underline; } --> </style> <center><div align="center" style="font-size:14pt"><a name="top"><img src="banner_grande_2.gif" width="640" height="82" border="0"></a><br> <a href="index.htm">Home</a> | [...] | <a href="link.htm">Link</a></div>
Aggiungo che nell'head c'è solo questo, oltre al tag "title":
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
-
Se ho capito bene, vorresti evidenziare la pagina che si sta vedendo giusto? Io ho trovato un buon metodo qui al punto 10:
in pratica si tratta di assegnare una classe specifica ad ogni elemento del menu, e poi un id specifico al body e con:#home .home, #about .about, .about, #contact .contact
{
comandi per il testo evidenziato
}Abbastanza semplice e pulito, secondo me.
Saluti,
Jub
-
Grazie, ma se è per qualcosa di semplice, mi basta togliere il link alla voce del menù relativa alla pagina in cui ci si trova, ottenendo così la scritta bianca anziché gialla (con un tag posso anche colorarla diversamente...).
E' che vorrei capire il meccanismo per cui un effetto dichiarato in css non funziona...
-
Gas75, hai provato a togliere tutti gli stili dai tag html? Anche le proprietà HTML dei tag.