2012-08-02 10 views
8

¿Cómo dar alt y título para la imagen de fondo? ¿Es posible?¿Cómo dar alt y título para la imagen de fondo?

<div id="cont"></div> 

    #cont 
    { 
    background:#FFF url(../images/post.png) no-repeat; 
    } 
+0

Un caso de uso particular para esto es cuando desea utilizar la "portada" del tamaño de la imagen de fondo para tratar diseños receptivos sin aplastar la relación de aspecto. Estoy pesando entre una etiqueta de título en el div y tratando de lograr el mismo diseño con una etiqueta IMG. – Mark

Respuesta

10

No puede dar un alt y título para un fondo CSS, pero puede darle un título al div.

<div id="cont" title="Title!"></div> 

El título emergerá con el mouse-inactivo sobre el elemento div.

+0

¿es posible dar en css? – Prashobh

+2

Probablemente exista una manera de usar pseudoelementos y lo que sea (no estoy seguro de esto), pero eso no se recomienda ya que no es totalmente compatible y no es muy accesible. – Rodik

7

No, porque una imagen de fondo es más que un elemento decorativo, que no debería tener ningún significado semántico. HTML es para semántica y que significa, CSS es solo para apariencias visuales. Si la imagen es tan importante que debe tener un texto alternativo alt, conviértalo en un elemento HTML <img>.

+1

Gracias, entonces debería cambiar mi código. – Prashobh

-1

Intenté usar el elemento img.

fiddle

+0

De esta forma, agrega un atributo alt a la imagen transparente, no a la imagen de fondo. –

-2

Sí, esto es posible dentro de PHP como esta ..

if($moon==0) 
    {$icon_moon="background: url(mp0.png); background-repeat: no-repeat; 
    background-size: 15px 15px; background-position: right top"; 
    $title_mph = "Moon phase new";} 

En este caso la variable ($icon_moon) se inserta en una tabla para el posicionamiento de esta manera

añadiendo un texto alternativo es también posible de esta manera.

Cuestiones relacionadas