Foros del Web

Foros del Web (http://www.forosdelweb.com/)
-   CSS (http://www.forosdelweb.com/f53/)
-   -   duda sobre background: url(.... (http://www.forosdelweb.com/f53/duda-sobre-background-url-589207/)

MandrakeXP 23/05/2008 04:48

duda sobre background: url(....
 
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:
Cita:

<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 23/05/2008 05:24

Respuesta: duda sobre background: url(....
 
Hola:

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

Saludos :arriba:

MandrakeXP 23/05/2008 05:42

Respuesta: duda sobre background: url(....
 
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 23/05/2008 06:45

Respuesta: duda sobre background: url(....
 
Hola:

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

Saludos :arriba:

Mikmoro 23/05/2008 11:14

Respuesta: duda sobre background: url(....
 
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 23/05/2008 13:17

Respuesta: duda sobre background: url(....
 
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


La zona horaria es GMT -6. Ahora son las 19:01.

Desarrollado por vBulletin® Versión 3.8.7
Derechos de Autor ©2000 - 2026, Jelsoft Enterprises Ltd.