È possibile nascondere il testo alternativo tramite CSS in tutti i browser,Come nascondere il testo alternativo tramite CSS quando l'immagine non è presente?
Ho provato con color:transparent, funziona su tutti i browser tranne IE.
È possibile farlo in IE utilizzando CSS ?. Grazie in anticipo per qualsiasi aiuto.
Invece di utilizzare color:transparent; utilizzare display:none;.
Ma si consiglia di non utilizzare questa tecnica.
Come @Quentin detto nel commento:
Se il testo non è abbastanza buono per gli esseri umani allora non è abbastanza buono per i motori di ricerca.
Non si dovrebbe nascondere il testo alternativo. Google lo sa solo usato per scopi SEO e nulla di importante e penalizzerà per tale. E potresti essere inserito nella lista nera sul motore di ricerca di Google.
Quindi, non usarli solo per scopi SEO.
grazie @Bhijendra Nepal Il colore sta avendo il valore trasparente vedi la specifica https://www.w3.org/TR/css3-color/#transparent. Display: nessuno non risolverà il mio scopo –
Scusa, lo stavo presumendo. –
@BhojendraNepal: capita a tutti a volte anche a me, nessun problema grazie per l'aiuto –
È possibile utilizzare text-indent:-9999px
HTML
<img src="images/test.jpg" alt="alternative">
CSS
img{
text-indent:-9999px
}
text-indent non funziona, vedi il tuo violino in IE9 –
se aggiungiamo 'line-height', quindi text-indent' funzionerà in tutti i browser ... è meglio usare' line-height: 1em; ' –
futuro, si prega di attenersi a correggere l'inglese, non parlare di testo. Rende comprensibile il sito per coloro che non parlano in inglese e hanno difficoltà a comprendere i dialetti. –
Usa 012.354.e display: none.
HTML
<h1 class="technique-four">
<a href="#">
<img src="images/header-image.jpg" alt="CSS-Tricks" />
</a>
</h1>
CSS:
h1.technique-four {
width: 350px; height: 75px;
background: url("images/header-image.jpg");
text-indent: -9999px;
display: none;
}
Il metodo Kellum:
.hide-text {
text-indent: 100%;
white-space: nowrap;
overflow: hidden;
}
come spiegato qui: replacing-the-9999px-hack-new-image-replacement
questo ha funzionato:
transparent non ha funzionato anche per me.
si potrebbe anche utilizzare il onerror callback per impostare la proprietà di visualizzazione a nessuno:
<img src="images/test.txt" onerror="this.style.display='none';">
Qual è il punto di avere testo alternativo se non visualizzarla con l'immagine non può essere mostrato? – Quentin
puoi usare 'text-indent: -9999px;' –
@Quentin: necessario per SEO e gestito lo scenario di errore dell'immagine in modo alternativo, mostrando l'immagine predefinita –