Visualizzazione dei risultati da 1 a 6 su 6
  1. #1
    Utente di HTML.it
    Registrato dal
    Jun 2002
    Messaggi
    585

    bordo immagine al passaggio del mouse

    Ciao a Tutti,
    uso IE 6

    nella mia pagina web ho creato un link ad un' immagine che funziona benissimo ...
    Vorrei che SOLO al passaggio del mouse sopra l' immagine, comparisse e fosse quindi visibile il bordo dell' immagine stessa ...

    Ho letto prima su questo forum una discussione passata da cui ho preso spunto per definire una classe, ma quello che mi succede e':
    al passaggio del mouse si amplifica il bordo che rimane sempre presente in magenta (penso colore di default di quando si genera un link con IE) anche quando non ci passo col mouse ...

    Come risolvere il problema ???

    Grazie mille in anticipo !!!

    <head>
    <style type="text/css">
    a.img:hover { border: 1px #00c solid; }
    </style>
    </head>

    <body>
    ...
    <a class="img" target="_blank" href="projects/manuale.pdf" style="outline:none" >
    [img]images/help.jpg[/img]</a>
    ....

  2. #2
    IE6, quando fai un link su immagine, ci aggiunge un bordo

    personalemnet la prima cosa che faccio è aggiungere nel css

    img{border:0;}

    la tua idea è giusta, ma sintatticamente errata...

    a.img significa un link (a) di classe "img"

    devi scrivere

    a img{border: 1px solid #00c;}

  3. #3
    Utente di HTML.it
    Registrato dal
    Jun 2002
    Messaggi
    585
    Ho fatto come mi hai detto,
    ma mi rimane SEMPRE visibile il bordo

    <head>
    <style type="text/css">
    img{border: 0;}
    a img{border: 1px solid #00c;}
    </style>
    </head>

    <body>
    ...
    <a target="_blank" href="projects/manuale.pdf">
    [img]images/help.jpg[/img]</a>

  4. #4
    Utente di HTML.it
    Registrato dal
    Jun 2002
    Messaggi
    585
    Risolto !!!

    Guardando in internet ho provato questa maniera e funziona !!!

    <head>
    <style type="text/css">
    a{
    border: 0 !important;
    border: 1px solid white ;
    }
    a:hover{
    border: 1px solid #00c;
    }
    img{border: 1px solid red !important;
    border: 0;
    }
    img:hover{
    border: 1px solid #00c !important;
    }
    </style>
    </head>

    <body>
    ...
    <a target="_blank" href="projects/manuale.pdf">
    [img]images/help.jpg[/img]</a>

    Grazie di tutto !!!

  5. #5
    colpa mia... avrei dovuto scrivere

    a img:hover

    il codice sembra buono...
    ti cosniglio però di verificare se la visione su IE6 ti soddisfa...

    l'utlizzo di !important normalmente si utilizza per problemi di compatibilità con i vecchi browser.

  6. #6
    Utente di HTML.it
    Registrato dal
    Jun 2002
    Messaggi
    585
    OK, Grazie !!!


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.