[HTML] creare link con colori Hover diversi, possibile?

Sermatth72

Nuovo Utente
2 Gen 2018
13
1
3
51
Sicilia
Ho bisogno di creare 3 serie di links di colore "Hover" diverso, una serie per quelli nell'articolo di una pagina, e le altre due serie mi servirebbero: una per il menu laterale e l'altra per i link a fondo pagina (Chi siamo | FAQ | Contattaci" etc.)

Qualcuno sa dirmi come si fa?! :confused: Grazie!
 

Max 1

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
29 Feb 2012
4.449
338
83
Ciao
Allora non vedendo niente del tuo codice e della tua pagina vado un po' a naso
Se i link in partenza hanno tutti lo stesso colore, dovresti creare tre classi esempio:
HTML:
hover.link1 {color:blue;}
hover.link2 {color:red;}
hover.link3 {color:yellow;}
Poi assegni le classi alle tre serie di link
 

Max 1

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
29 Feb 2012
4.449
338
83
si chiedo scusa ha ragione @iTonto
Codice giusto:
HTML:
.link1:hover {color:blue;}
.link2:hover {color:red;}
.link3:hover {color:yellow;}
Chissa dove avevo la testa (mi sono cosparso il capo di cenere)
 

Max 1

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
29 Feb 2012
4.449
338
83
Piccolo e veloce esempio
HTML:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Documento senza titolo</title>
<style type="text/css">
* {
    padding: 0;
    margin: 0;
}
html {
    padding: 0;
    margin: 0;
    background: #FFFFFF;
}
body,td,th {
    font-family: Verdana, Arial, Tahoma, Calibri, Geneva, sans-serif;
    font-size: 13px;
    color: #000000;
}
body {
    width: 980px;
    margin: 0 auto;
    padding: 0;
}
a {
    color: #000DFF;
}
a:link {
    text-decoration: none;
}
a:visited {
    text-decoration: none;
    color: #000DFF;
}
a:hover {
    text-decoration: none;
    color: #0E8F00;
}
a:active {
    text-decoration: none;
    color: #000DFF;
}
.header {
    background-color: #D0D0D0;
    margin: 0px;
    padding: 20px;
    height: 100px;
    width: 938px;
    border: 1px solid #000000;
}
.menu {
    background-color: #FFEAEA;
    margin: 0px;
    padding: 20px;
    float: left;
    height: 100%;
    width: 200px;
    border: solid 1px #000000;
}
.menu ul li a:hover {
    color: #A8A700;
}
.contenuto {
    background-color: #FFDDA7;
    float: left;
    margin: 0px;
    padding: 30px;
    height: 100%;
    width: 678px;
}
.contenuto .artcolo:hover {
    color: #FF0004;
}
#box {
    margin: 0px;
    padding: 0px;
    height: 600px;
    width: 980px;
}
#clear {
    clear: both;
}
#footer {
    background-color: #DFFFFB;
    margin: 0px;
    padding: 30px;
    height: 110px;
    width: 920px;
}
#footer a:hover {
    color: #000000;
}
</style>
</head>

<body>
<div id="box">
  <div class="header">
    Inserite qui il contenuto per  class "header" <br> <br>
    <a href="#" target="_self">questo è un link</a>
  </div>
  <div class="menu">
    <ul>
      <li><a href="#" target="_self">Link 1</a></li>
      <li><a href="#" target="_self">Link 2</a></li>
      <li><a href="#" target="_self">Link 3</a></li>
      <li><a href="#" target="_self">Link 4</a></li>
      <li><a href="#" target="_self">Link 5</a></li>
      </ul>
  </div>
  <div class="contenuto">
    Inserite qui il contenuto per  class "contenuto"<br><br>
    <a class="artcolo" href="#" title="articolo" target="_self">Questo è un link articolo</a>
  </div>
  <div id="clear"></div>
  <div id="footer">
      Inserite qui il contenuto per  id "footer"<br><br>
      <a href="à" title="Link" target="_self">Link del footer</a>
  </div> 
</div>
</body>
</html>
 
Discussioni simili
Autore Titolo Forum Risposte Data
F Creare elementi html con javascript Javascript 3
A [HTML] Creare sito web per eLearnig HTML e CSS 2
max_400 [HTML] Come creare un jpg animata (non gif animata) HTML e CSS 3
T con oop creare un ciclo per una pagina dinamica html con php PHP 3
S [PHP] [HTML] Come creare un grafico dinamico PHP 4
A [HTML] E' possibile creare un tema per wordpress con dreamweaver?? HTML e CSS 1
Andrea_Ventura [HTML] Creare un DIV con slideshow HTML e CSS 5
S [Javascript] [HTML] creare stringhe di riferimento da riutilizzare Javascript 5
F Creare un contatore numerico in HTML HTML e CSS 9
Selenio89 [HTML] creare menu di navigazione HTML e CSS 2
S Creare un foglio di calcolo in html collegandolo a un e-commerce HTML e CSS 7
D [HTML] come Creare questo pulsante a 3 strisce? HTML e CSS 2
Monz94 [Javascript] [HTML] Creare Checkbox o Radio con Immagini Javascript 0
Matteol92 [HTML] Creare social box senza sovrapposizione HTML e CSS 5
atipika creare codice html da immagine HTML e CSS 1
D [Javascript] Come creare un equalizzatore HTML collegato a files audio Javascript 1
R [PHP] [HTML] Creare script invio modulo contatti PHP 2
M [Javasript + HTML] come creare textbox in tr specifica Javascript 0
V creare un collegamento di pagina html in php PHP 10
asevenx [HTML] Creare mappa interattiva con Illustrator HTML e CSS 5
helpdesk creare una pagina html dimanicamente con php PHP 12
C File html con procedure javascript per creare effetto libro da sfogliare Javascript 9
C Javascript completo di html per creare una tabella dove compare il saluto in base all'ora. Javascript 2
R Creare pagina HTML da script PHP PHP 2
S creare sito web html css HTML e CSS 5
J Creare file html da un form in area riservata PHP 9
K creare pagine html con parti in comune [era:Consiglio tecnico] HTML e CSS 3
G in flash è possibile creare una finestra che visualizza una pagina html? Flash 0
P guida di dreamweaver per creare codice html pulito Webdesign e Grafica 1
G AIUTO! Vorrei creare un guestbook nel mio sito html.. come faccio? HTML e CSS 2
Z Software Per Creare Html Con Thumbnails HTML e CSS 10
L creare o modificare una .GIF da mettere su una pagina HtmL HTML e CSS 5
G Pagina html in stringa PHP 2
E Sostituzione Elemento Html PHP 3
G Elementi HTML HTML e CSS 1
K Visualizzare del html responsive in una Webview Sviluppo app per Android 0
T Domanda valutazione html LinkedIn 2022 pt3 HTML e CSS 7
T Domanda valutazione html LinkedIn 2023 pt2 HTML e CSS 15
T Domanda valutazione html LinkedIn 2023 pt1 HTML e CSS 1
MarcoGrazia Salvataggio HTML in database PHP 2
K posizionare variabile da pagina html all'iframe. Javascript 1
peppe0703 Come Estrarre dati da db wordpress e richiamarli in html esterno HTML e CSS 0
L problema collegamento file css con html HTML e CSS 1
D Informazioni da XAMPP su HTML PHP 0
R Immagini html HTML e CSS 2
K File audio in html, chi mi può aiutare? HTML e CSS 0
K Aiuto con file audio in html HTML e CSS 1
Antonio67 Lanciare file shell bash da html HTML e CSS 2
M Riportare in tabella HTML dati estratti con query SQL MySQL 0
G Codice html Javascript 1

Discussioni simili