• User

    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.


  • User Attivo

    Ciao Gas75,
    Le proprietà nel body non andrebbero usati, le dichiarazioni che fai nel foglio di stile sono sufficienti 🙂

    Controlla che il colore non sia sovrascritto da qualche altra dichiarazione inline all'interno dei tag.

    :ciauz:


  • User

    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.:?

  • User Attivo

    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?


  • User

    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">
    

  • User

    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


  • User

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


  • User Attivo

    Gas75, hai provato a togliere tutti gli stili dai tag html? Anche le proprietà HTML dei tag.