Visualizzazione dei risultati da 1 a 9 su 9

Discussione: testo cambio colore...

  1. #1
    Utente di HTML.it
    Registrato dal
    Jul 2000
    Messaggi
    881

    testo cambio colore...

    coem si fa in un menu a far si che andando sopra le varie voci queste cambin colore tenendo conto che le voci del menu non sono "imamgini" ma sono scritte con i ltesto di dreamweaver...

  2. #2
    Tramire css...

    .menu {
    font: Verdana;
    color: #cc0011;
    }
    .menu:hover {
    font: Verdana;
    color: #cc1100;
    }

    Poi il collegmento lo fai:
    <a href="coll.htm" class="menu">

    Ovviamente da css imposti tutto quello che vuoi...
    Per esempio un bell'effetto è mettere in .menu:hover_
    codice:
    background-color:#color;
    display: block;
    che trasforma al passaggio del mouse il colore dello sfondo e lo applica a tutto il div...

  3. #3
    Utente di HTML.it
    Registrato dal
    Jul 2000
    Messaggi
    881
    coem come..?io con i css...mi sclego i font da utlizzare non li uso per le tabelle..potresti spiegarmi la "cosa2 in maniera piu semplice che mi interessa molto...

  4. #4
    In sostanza setti nella "cosa1" il prima.
    Non solo carattere e colore, ma anche grandezza, allineamento e tutto quello che normalmente è possibile settare per un testo.

    Nella "cosa2" setti come deve essere al passaggio del mouse (il cosiddetto effetto rollover).

    Per esempio, guarda questa pagina che sto costruendo, uso questa tecnica.


    Poi crei il tuo collegamento:
    codice:
    <a href="paginachevuoicollegare" class"menu">
    Collegamento testuale </a>
    <-- Con classe richiami ciò che hai settato nel CSS -->
    E' un po' più chiaro?

  5. #5
    Ovvio con i CSS ti scegli tutta la formattazione del testo:
    ---------------------------------------
    questo tra i tag <head>

    <style>
    div#menu a{
    font-family: Verdana, Arial, Sans-serif;
    font-size:0.8em;
    font-weight: bold;
    font-style: normal;
    text-decoration: none;
    color: #FF0000;
    background: #000000;
    }

    div#menu a:hover{
    text-transform: uppercase;
    color: #000000;
    background: #FF0000;
    }
    </style>
    ---------------------------------------------

    <body>
    <div id="menu">
    prova questo
    </div>
    </body>
    Sayonara...

    kami del tempo / raccogli i miei ricordi / vola distante.

    Rinaldo - RexPlants
    RexPlants il forum delle piante che mangiano

  6. #6
    Utente di HTML.it
    Registrato dal
    Jul 2000
    Messaggi
    881
    SONO IN ALTO MARE... :master: ... HO MESSO GL ISFODNI PER I TESTI...MA NON RIESCO A CAPIRE COME SI FA PER QUEL CHE MI AVETE DETTO..."COSA1"..."COSA2"... :master: ?IO HO DELLE SEMPLICI "VOCI" TESTUALINEL MENU...

  7. #7
    Supponiamo il tuo menù comprenda:
    HOME PAGE
    CURRICULUM
    FOTO

    Ovviamento, scritto in html si traduce in:
    codice:
    <body>
    HOME PAGE
    CURRICULUM
    FOTO
    </body>
    Fin qui è chiaro?

  8. #8
    Utente di HTML.it
    Registrato dal
    Jul 2000
    Messaggi
    881
    azz..si fin qui tutto chiaro..piu che chiaro.... :rollo:

  9. #9
    Ora devi lavorare sul css.
    Supponiamo di voler fare il testo del Menù di colore rosso e al passaggio farlo diventare blu...

    Creiamo una classe (che è riconoscibile dal punto)
    .menu {
    font: Verdana;
    color: #cc0909;
    }

    Poi, per fare in modo che cambi colore definiamo la classe al passaggio del mouse

    .menu:hover {
    font: Verdana;
    color: #cc1010;
    }

    (in realtà i colori li ho messi a caso ora)...

    Salviamo il css (a meno che tu non ne abbia già uno) come layout.css
    Ora dobbiamo dire nella pagina che il menù segue quelle impostazioni.
    Iniziamo a dire (nel head) che deve fare rifderimento a quel foglio di stile:
    <link href="layout.css" rel="stylesheet" type="text/css" />

    Prendiamo la struttura di prima e la trasformiamo così:
    codice:
    <body>
    HOME PAGE
    CURRICULUM
    >FOTO
    </body>

    Ora che ne dici?

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.