Pagina 1 di 3 1 2 3 ultimoultimo
Visualizzazione dei risultati da 1 a 10 su 30

Discussione: [CSS] Far scomparire o meno il bordo del Link a img

  1. #1

    [CSS] Far scomparire o meno il bordo del Link a img

    Vorrei far apparire un bordo diverso dallo standard blu ad una immagine linkata ma solo con l'"hover".
    Con "link" lasciarla senza bordo, con "active" farla apparire con un bordo differente.

    Ho provato con text-decoration: none e underline ma ovviamente non funziona, con il border, margin e paddin a zero, ma niente anora.

    Ho cercato nel forum, ma gli argomenti si avvicinano senza darmi risposte corrispondenti

    CSS
    a.fotovert:link { border: 0px solid #AB6400; margin:0; padding:0; }
    a.fotovert:visited { border: 0px solid #AB6400; margin:0;padding:0; }
    a.fotovert:hover { border: 1px solid #AB6400; }
    a.fotovert:active {border: 1px solid #684C09; }

    HTML
    [img]img/mulino.jpg[/img]

    Qui da una lezione di AWD, mi è parso di capire che è meglio utilizzare il title dell'ancor e non l'alt per una img linkata.

  2. #2
    Utente di HTML.it L'avatar di salasir
    Registrato dal
    Apr 2004
    Messaggi
    1,885
    Secondo me è sbagliata la definizione. Prova così:
    codice:
    CSS 
    .fotovert a:link { border: 0px solid #AB6400; margin:0; padding:0; } 
    .fotovert a:visited { border: 0px solid #AB6400; margin:0; padding:0; } 
    .fotovert a:hover { border: 1px solid #AB6400; } 
    .fotovert a:active {border: 1px solid #684C09; }
    Maurizio

  3. #3
    Dunque, il problema credo sia solo la confusione sintattica nel css. Devi scrivere così
    codice:
    .fotovert:link img {
       /* proprieta' */
    } 
    /* ... */
    Per quanto riguarda il discorso alt-title, non è vero che è meglio usare l'uno o l'altro: prova a rileggere meglio l'intervento di awd e ti accorgerai dell'importanza e del significato di entrambi.


  4. #4

  5. #5
    Utente di HTML.it L'avatar di salasir
    Registrato dal
    Apr 2004
    Messaggi
    1,885
    Originariamente inviato da pierofix
    Dunque, il problema credo sia solo la confusione sintattica nel css. Devi scrivere così
    codice:
    .fotovert:link img {
       /* proprieta' */
    } 
    /* ... */
    Scusa, ma se lui vuole cambiare il colore a seconda dello stato hover/active devi giocare su a:stato e non sull'immagine, o sbaglio?

    Maurizio

  6. #6
    Il bordo è da riferirsi all'immagine, non al tag a.

  7. #7
    Grazie ragazzi, presiosi e tempestivi come al solito
    .fotovert:link img { border: 1px solid #ff9900; margin:0; padding:0; }
    .fotovert:visited img { border: 1px solid #AB6400; margin:0;padding:0; }
    .fotovert:hover img { border: 1px solid #AB6400; }
    .fotovert:active img {border: 1px solid #684C09; }
    Ho sperimentato, questo codice, come da vs suggerimenti, ed effettivamente funziona, (Correggo. ho provato in IE e non funziona, come posso fare ?) solo che per evitare il ballo in giù dell'img, con e senza bordo, ho pensato di giocare solo con il colore, mi rimane comunque sempre il bordo per effetto di
    .fotovert {width: 74px; border: 1px solid #AB6400; margin-bottom: 8px; margin-top: 5px; padding: 0px; }
    che dovrò eliminare con border a 0px.

    Inizialmente, non volevo linkare l'immagine ma solo bordarla appunto con .fotovert, ma poi ho letto che l'alt delle immagini, viene riconosciuta e indicizzata dai MR come Google solo se l'img è linkata.

    In realtà dovrei pensare meglio come indicare al visitatore del sito che quell'immagine è linkata, spero che un bordo che scompare o cambia colore al passaggio del mouse possa essere sufficiente.

    Per quanto riguarda il discorso dell'alt/title dell'img/url, questo mi è parso di capire dalla lezione di AWD

    Se l'img non è linkata, si usa l'alt, se è linkata il title dell'ancor, anche perchè se si mettono tutti e due, al passaggio del mouse, compare solo il title e non l'alt.
    Ma forse AWD si riferiva al fatto che, l'alt compare quando, l'img non carica.

  8. #8
    A proposito, mi era successa una cosa strana, avevo cambiato la dichiarazione della codifica del carattere in UFT 8, e la data in js, non mi appariva + perchè dovevo indicare le lettere accentate con la corrispondente codifica.

    Voi come vi state comportando, dichiarate l'UFT 8 o no ? Questo sarà il futuro, mi sembra, o forse è pericoloso farlo ?

  9. #9
    Originariamente inviato da pcf
    Per quanto riguarda il discorso dell'alt/title dell'img/url, questo mi è parso di capire dalla lezione di AWD

    Se l'img non è linkata, si usa l'alt, se è linkata il title dell'ancor, anche perchè se si mettono tutti e due, al passaggio del mouse, compare solo il title e non l'alt.
    Ma forse AWD si riferiva al fatto che, l'alt compare quando, l'img non carica.
    L'ALT è obbligatorio, quindi devi metterlo sempre e deve descrivere brevemente l'immagine
    Il TITLE lo usi se vuoi dare un'indicazione in più sull'immagine che non viene definita nel documento

    esempio

    ALT="foto di un gatto bianco e nero visto di schiena"
    TITLE="clicca per ingrandire l'immagine"

    Volendo potresti indicare nel documento, vicino all'immagine, un paragrafo con scritto: "cliccate sull'immagine per visualizzarla a dimensione reale" ed omettere il TITLE.

    in generale io consigliavo di usare TITLE sulle immagini che fungono da link, in assenza di una precisa descrizione testuale, ma se lo usi nn fa mai male!

  10. #10

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 © 2017 vBulletin Solutions, Inc. All rights reserved.