Nascondere il testo usando i css

Ho un tag nel mio html come questo:

<h1>My Website Title Here</h1>

Usando i css voglio sostituire il testo con il mio logo attuale. Ho ottenuto il logo senza problemi ridimensionando il tag e mettendo un'immagine di sfondo tramite css. Tuttavia, non riesco a capire come sbarazzarmi del testo. L'ho visto fare prima, fondamentalmente spingendo il testo fuori dallo schermo. Il problema è che non riesco a ricordare dove l'ho visto.

Il modo più cross-browser friendly è scrivere l'HTML come

<h1><span>Website Title</span></h1>

poi usare i CSS per nascondere lo span e sostituire l'immagine

h1 {background:url(/nicetitle.png);}
h1 span {display:none;}

Se puoi usare i CSS2, allora ci sono dei modi migliori usando la proprietà content, ma purtroppo il web non è ancora al 100%.

Commentari (4)

puoi usare la proprietà css background-image e z-index per assicurarti che l'immagine resti davanti al testo.

Commentari (0)

La risposta è creare una spanna con la proprietà

{display:none;}

Puoi trovare un esempio su questo sito

Commentari (1)