duda sobre background: url(....

[MandrakeXP]

estaba echando una ojeada a un css de una web y he visto lo siguiente:

Código:

<ul>
<li class="all"><a href="#" >test</a></li>
<li class="all"><a href="#" >test</a></li>
<li class="all"><a href="#" >test</a></li>
<li class="all"><a href="#" >test</a></li>

<li class="extra"><a href="#">test</a></li>
</ul>

y su css:

Código:

#h #h-pri li.extra a {
    background: url(/img/menu-current.gif) 0 -179px no-repeat;
}

#h #h-pri li.extra a:hover {
    background: #e6f2d4 url(/img/menu-current.gif) 0 -149px no-repeat;
}

lo que hace, es poner una imagen de fondo muy pequeña sobre el link, pero he ido a la url de la imagen http:...../img/menu-current.gif he visto que era una imagen grande con muchos iconos.. todos los que se usan en parte de la web...

la especificación dice esto:

<medida> <medida>
Con un par de valores de '2cm 2cm', la esquina superior izquierda de la imagen es ubicada 2cm a la derecha y 2cm abajo de la esquina superior izquierda del área de relleno.

según deduzco se puede usar como fondo una parte de la imagen, dándole las coordenadas... pero mi pregunta es ¿no se le deberian pasar 4 coordenas? tipo
(2,3) (3,5) es decir, la coordenada delpixel de inicio y las coordenadas delpixel de fin?

en el ejemplo de antes:

Código:

    background: url(/img/menu-current.gif) 0 -179px no-repeat;

se le especifica la coordenada de inicio (0, -179) pero no la del final...para saber donde acaba la porción de imagen que quiero mostrar.

sabeis algo al respecto?

gracias

[caricatos]

Hola:

Nunca he visto imágenes recortadas como fondo... ¿donde te has informado?

Saludos

[MandrakeXP]

mira mac lo que hace:
http://images.apple.com y mira de donde saca sus fondos de links:

http://images.apple.com/global/nav/i...lobalnavbg.png


mas ejemplos y tutoriales:

http://www.webdesignerwall.com/tutor...nced-css-menu/

http://www.alistapart.com/articles/sprites/


pero aún no sé como el navegador sabe qué porción de imagen usar si sólo sabe una coordenada... :S


sigo investigando :)

[caricatos]

Hola:

Creo que buscas la propiedad clip, pero insisto en que las imágenes no se recortan.

Saludos

[Mikmoro]

Yo diría que la imagen no está recortada, sino simplemente desplazada. El -179 hará que la imagen desaparezca por arriba excepto una pequeña porción, que es la que quiere mostrar.

Es lo que supongo sin hacer visto el ejemplo, pero exatamente para eso es para lo que se usa una magnitud negativa en ese caso.

Mikel.

[Jamati]

Pero este truco muy bueno, por lo visto funciona tanto en FF como en cualquier versión de IE, pero puede ser que en IE tarde como un poquito en recargar la imagen cada vez que se pasa el mouse por arriba ??

O esto, una vez qeu cargó la imágen, luego la toma del cache ?... o la tiene que volver a cargar ?

Saludos