a ver quiem me orienta un poco....

[DragonX]

Les cuento un poco que es lo que necesito....sinceramente mucha idea de CSS no tengo, lo utilizo y mucho, pero siempre a nivel básico....como una simple hoja de estilos donde pongo estilos de links, textos, tablas, etc...

Investigando y tratando de mejorar mis conocimientos para poder explotar al 100% los estilos me encontre con algo que me movió el piso..... RollOver de imágenes por medio de CSS!!!!!

tengo este código de navegación:

Código PHP:

      div#navi {
    width:192px;
    margin-bottom:88px;}
 
    div#navi ul {
    list-style:none;
    padding:0;
    margin:0;}
 
    div#navi li {
    font-family:"sans serif", Verdana;
    font-size:9px;
    font-weight:bold;
    text-transform:uppercase;
    letter-spacing:2px;
    background-image:url(Layout/navi.gif);
    background-repeat:repeat-y;
    background-position:top right;
    padding:5px 0 5px 13px;
    width:179px;
    border-bottom:1px solid #778083;
    display:block;}
 
    div#navi .home {
    border-top:1px solid #778083;}
 
    div#navi li a:link, div#navi li a:active, div#navi li a:visited {
    width:179px;
    color:#A4A495;
    display:block;
    cursor:default;}
 
    div#navi li a:hover {
    width:179px;
    background-image:url(Layout/navihover.gif);
    background-repeat:repeat-y;
    background-position:top right;
    padding:5px 0 5px 13px;
       margin:-5px 0 -5px -13px;
    color:#F8F8F8;
    text-decoration:none;
    display:block;
    cursor:default;} 
   

y en el HTML este código que hace referencia al CSS:

Código HTML:

<div id="navi">
<ul>
<li class="home"><a href="index.php">Home</a></li>
<li><a href="brushes.html">PS Brushes</a></li>
<li><a href="tex.html">Textures</a></li>
<li><a href="stocks.html">Stock Photos</a></li>
<li><a href="other.html">Other</a></li>
<li><a href="info.html">Site Info</a></li>
<li><a href="tagboard.html">Tagboard</a></li>
</ul> 

Ahora mi pregunta es la siguiente....¿De dónde está trayendo las imágenes ya que en código del CSS figura url(Layout/navihover.gif)?¿Qué es ese "Layout"?

Por favor si alguien me pudiera abrir un poco los ojosse lo agradeceria....

Gracias D-X

[JavierB]

Hola DragonX

Layout es la carpeta donde está guardada la imágen. Si tu página está en:

www.tupagina.com

la imágen estaría en:

www.tupagina.com/Layout/navi.gif

Saludos,

[DragonX]

Gracias JavierB, eso me lo imaginaba, pero porque no pone las imagenes asi?:

Código PHP:

  background-image:url(http://www.unapagina.com.ar/Layout/navi.gif); 
   

y pone simplemente

Código PHP:

  background-image:url(Layout/navi.gif); 
   

Si probás este código de manera local te trae las imagenes que utilizó esta persona......creo que Layout esta definido en otro lado, puede ser?

Gracias!!!

[webosiris]

quizás quieras leer Enlaces relativos y enlaces absolutos

Lo que hace al ponerlo de esa forma es que te toma siempre una ruta relativa al documento: si tu css está en el disco duro, te lo toma de forma relativa al disco duro.. si lo subís a un server, te lo toma de forma relativa a la ruta de tu dominio..

[DragonX]

oki doki.....estuve haciendo pruebas con lo que me dijo JavierB y anda perfectamente, mil gracias a los dos.....al final era una tonteria, pero al no saber bien me confundí...

gracias a los dos de nuevo!
DX