Entrar

no puedo agregar una imagen en el menu

atino · · Solicitar retirada
Hola estoy configurando mi menu en la pagina, lo estoy siguendo talcual los pasos del curso, va todo bien hasta que tengo que poner la imagen de los bordes, es que no aparecen por ningun lado. que puede pasar este es mi html:

head>
<meta content="text/html; charset=iso-8859-1" http-equiv=Content-Type>
<title>atinoproducciones</title>
<link rel="stylesheet" href="../estilosdos.css"type="text/css" media="all">
</head>

<body>
<div id="global">
<div class="borde-superior"></div>
<div id="cabecera">
<div id="logotipo">
<img src="objetos/logo.png" width="270" height="170"
alt="Haz clic aqui para volver a ver la pagina de inicio";>
</div>
<div id="publicidad"><img src="objetos/foto-camara.png"width="270" height="170" >
</div>
</div>
<div id="navegacion"><ul>
<li><a href="../index.html"><b class="ID">Home</b></a></li><li><a href="../fotografia/fotografia.html"><b class="ID1">Fotografia</b></a></li><li><a href="../equipo_tecnico/equipo_tecnico"><b class="ID2">Equipo Tecnico</b></a></li><li><a href="../contacto/contacto.html"><b class="ID3">Contacto</b></a></li>
</ul>
</div>
<div id="contenido">
<div id="menu">
<ul>
<h1>Menu</h1>
<li><a href="#">Reportajes</a></li><li><a href="#">Piezas Informativas</a></li><li><a href="#">Programas de Television</a></li><li><a href="#">Eventos</a></li>
</ul>
</div>
<h1>ATINOPRODUCCIONES</h1>
<p class="centrado" "texto-color" >En esta seccion encontraras algunos de los trabajos que realizo </p>
<p class="centrado" "texto-color"> Piezas Informativas</p>
<p class="centrado"><iframe width="425" height="349" src="http://www.youtube.com/embed/ez0DzRTziTc" frameborder="0" allowfullscreen></iframe></p>
<p class="centrado"><iframe width="425" height="349" src="http://www.youtube.com/embed/tFV1-awk27Q" frameborder="0" allowfullscreen></iframe></p>
<a href="../videos_dos/videos_dos.html">continuar</a>
<div id="contenido">
<div id="pie">
<div id="pieuno"><ul>
<li><a href="http://www.facebook.com" target="_blank"><img src="objetos/logo-face-espejo.png"width="30" height="30" ></a></li>
</ul>
</div>
<div id ="piedos" class="texto-color">www.atinoproducciones.com</div>
<div id="pietres"><ul>
<li><a href="http://www.youtube.com/user/atinoproducciones" target="_blank"><img src="objetos/you-tube-logo-espejo.png"width="50" height="30"></a></li>
</ul>
</div>
</div>

<div class="borde-superior"></div>
</div>

</body>
</html>

y este mi CSS:


* {margin:0px; padding:0px; border:0px;}
body {text-align:center;background-color:black;background-image:url(objetosdos/lente.png);background-repeat:no-repeat;background-position:center center;}
img {border-style:none;}
#global {width:800px; margin:4px auto;}
#cabecera {height:85px;}
.borde-superior {background-image:url(objetosdos/borde-superior.png);background-repeat:no-repeat; width:800px; height:12px;}
h1 {font-size:2em; color:#B22222; font-weight:bold; text-decoration:none; text-align:center;}
.texto-color {color:white;}
.parrafouno { font-family:Tahoma,Arial,Helvetica,sans-serif ;}
.centrado {text-align:center;}
p {font-size:0.5cm}
p { margin: 10px 10px 10px 10px; color:white;}
td { background-color:black ; color:white ; padding:20px 10px 20px 10px ; }
#logotipo {width:200px; float:left;}
#publicidad {width:518px; float:right;}
#navegacion { height:160px;}
#navegacion li {float:left; list-style:none;margin:20px 3px 20px 3px;}
#navegacion ul { margin-left:5px }
#navegacion a {background-image:url(objetosdos/boton-por-fuera-vacio.png);background-repeat:no-repeat;width:180px;height:50px;text-decoration:none;margin:15px 0px 10px 0px;padding:15px 0px 10px 0px}
#navegacion a:hover {background-image: url(objetosdos/boton-por-dentro-vacio.png);background-repeat:no-repeat;width:180px;height:50px;text-decoration:none;margin:15px 0px 10px 0px;padding:15px 0px 10px 0px}
#contenido {background-color:none;}
#contenido p {padding:5px 10px 5px 10px; text-indent:15px;}
#menu { background-color:yellow;width:150px; float:left;text-align:left; margin:3px 10px 3px 3px;}
#menu h1 {text-decoration:none ; font-size:12px ;
background-image: url(objetos/menu-2.gif);}
#menu li {list-style:none;margin:4px 0px 4px 6px;}
#pie {border-left:1px solid; border-right: 1px solid;border-top: 40px solid; height:80px;}
#pie li {list-style:none;font-size:12px;}
#pieuno {float:left; width:150px;margin-top: 20px;}
#piedos {float:left; width:498px; margin-top: 20px;}
#pietres {float:left; width:150px;margin-top: 20px;}
#borde-inferior {background-image:url(objetosdos/borde-superior.png);background-repeat: no-repeat ;width:800px ; height: 40px}
a {color:brown; text-decoration:none; display:block;}
a:link {}
a:visited {}
a:hover {color:red; text-decoration:underline; background-color: none;}
a:active {}
.ID{text-indent:55px;font-size:0.4cm;color:black;text-decoration:none;font-weight:0;word-spacing: 0mm; text-align:center;margin-top: -20px;}
.ID1{text-indent:45px;font-size:0.4cm;color:black;text-decoration:none;font-weight:0;word-spacing: 0mm; text-align:center;margin-top: -20px;}
.ID2{text-indent:30px;font-size:0.4cm;color:black;text-decoration:none;font-weight:0;word-spacing: 0mm; text-align:center;tmargin-top: -20px;}
.ID3{text-indent:45px;font-size:0.4cm;color:black;text-decoration:none;font-weight:0;word-spacing: 0mm; text-align:center;margin-top: -20px;}
.ID4{margin:10px 0px 20px 0px}

Gracias
atino · · Solicitar retirada
Hola compañeros nadie sabe donde puedo estar cometiendo el error para que no se vea la imagen en el menu? gracias
systemof100 · · Solicitar retirada
Hola, olle estas seguro que tienes la imagen en objetos y que se llama asi, por que la mayoria se aquivoca Como yo jejeje bueno verifica eso y si esta bien, te recomiendo que no le cambies aun nada, como dice en Ejemplo con divs de CCTW, osea as todo lo que dice alpie de la letra, sin cambiar colores, textos etc. despues ya al final si kieres cambialo haslo, o mientras que haces el curso, has otro, me explico: Bueno tienes la carpeta web-ejemplo-cctw entonces crea otra llamada mis-pruebas o yo que se pero con diferentes cosas, eso es lo que yo hice y me funciono ahora tengo la del ejemplo con divs y la mia, que la hice solo. Bueno espero averte ayudado. Systemof100
atino · · Solicitar retirada
buenas, la ruta la revise mil veces. y el ejemplo del curso lo aplique en la carpeta de ejemplos cctw y me funciona y hasta ahora todo lo que hice con imagenes en mipagina me funciono, es mas tambien he copiado exactamente todos los datos que inserta jorgens y tampoco nada
Yaneth · · Solicitar retirada
hola
te pregunto de nuevo...
cuantas carpetas de imagenes tienes????

aqui tienes esto
#menu h1 {text-decoration:none ; font-size:12px ;
background-image: url(objetos/menu-2.gif);}

pero mas arriba dices esto

#navegacion a {background-image:url(objetosdos/boton-por-fuera-vacio.png);

saludos
atino · · Solicitar retirada
buenas el menu lo quiero hacer en la pagina de videos no en el index entonces he guardado la imagen en la carpeta de objetos de videos o hay que gusrdarlo en la carpeta de oobetos principal?
Doodleo · · Solicitar retirada
En vez de poner ruta relativa, intenta poner la ruta absoluta

prueba y nos cuentas
Yaneth · · Solicitar retirada
es que.. necesito ver como tienes ordenadas tus cosas

ya se que es una lata
pero pon una captura de pantalla con las carpetas necesarias abiertas

saludos
atino · · Solicitar retirada
Hola aqui esta las dos carpetas de objetos:

[contenido no disponible]

Uploaded with ImageShack.us

"OBJETOSDOS" ES LA CARPETA DEL INDEX Y "OBJETOS" es la carpeta de videos.html donde quiero poner el menu

el nombre del archivo lo cambie para ordenar un poco es menu-uno.png

Gracias compañeros
atino · · Solicitar retirada
Les paso el CSS.:

* {margin:0px; padding:0px; border:0px;}
body {text-align:center;background-color:black;background-image:url(objetosdos/lente.png);background-repeat:no-repeat;background-position:center center;}
img {border-style:none;}
#global {width:800px; margin:4px auto;}
#cabecera {height:85px;}
.borde-superior {background-image:url(objetosdos/borde-superior.png);background-repeat:no-repeat; width:800px; height:12px;}
h1 {font-size:2em; color:#B22222; font-weight:bold; text-decoration:none; text-align:center;}
.texto-color {color:white;}
.parrafouno { font-family:Tahoma,Arial,Helvetica,sans-serif ;}
.centrado {text-align:center;}
p {font-size:0.5cm}
p { margin: 10px 10px 10px 10px; color:white;}
td { background-color:black ; color:white ; padding:20px 10px 20px 10px ; }
#logotipo {width:200px; float:left;}
#publicidad {width:518px; float:right;}
#navegacion { height:160px;}
#navegacion li {float:left; list-style:none;margin:20px 3px 20px 3px;}
#navegacion ul { margin-left:5px }
#navegacion a {background-image:url(objetosdos/boton-por-fuera-vacio.png);background-repeat:no-repeat;width:180px;height:50px;text-decoration:none;margin:15px 0px 10px 0px;padding:15px 0px 10px 0px}
#navegacion a:hover {background-image: url(objetosdos/boton-por-dentro-vacio.png);background-repeat:no-repeat;width:180px;height:50px;text-decoration:none;margin:15px 0px 10px 0px;padding:15px 0px 10px 0px}
#contenido {background-color:none;}
#contenido p {padding:5px 10px 5px 10px; text-indent:15px;}
#menu { background-color:yellow;width:150px; float:left;text-align:left; margin:3px 10px 3px 3px;}
#menu h1 {text-decoration:none ; font-size:12px ;
background-image: url(objetos/menu-uno.png);}
#menu li {list-style:none;margin:4px 0px 4px 6px;}
#pie {border-left:1px solid; border-right: 1px solid;border-top: 40px solid; height:80px;}
#pie li {list-style:none;font-size:12px;}
#pieuno {float:left; width:150px;margin-top: 20px;}
#piedos {float:left; width:498px; margin-top: 20px;}
#pietres {float:left; width:150px;margin-top: 20px;}
#borde-inferior {background-image:url(objetosdos/borde-superior.png);background-repeat: no-repeat ;width:800px ; height: 40px}
a {color:brown; text-decoration:none; display:block;}
a:link {}
a:visited {}
a:hover {color:red; text-decoration:underline; background-color: none;}
a:active {}
.ID{text-indent:55px;font-size:0.4cm;color:black;text-decoration:none;font-weight:0;word-spacing: 0mm; text-align:center;margin-top: -20px;}
.ID1{text-indent:45px;font-size:0.4cm;color:black;text-decoration:none;font-weight:0;word-spacing: 0mm; text-align:center;margin-top: -20px;}
.ID2{text-indent:30px;font-size:0.4cm;color:black;text-decoration:none;font-weight:0;word-spacing: 0mm; text-align:center;tmargin-top: -20px;}
.ID3{text-indent:45px;font-size:0.4cm;color:black;text-decoration:none;font-weight:0;word-spacing: 0mm; text-align:center;margin-top: -20px;}
.ID4{margin:10px 0px 20px 0px}
Yaneth · · Solicitar retirada
hola de nuevo.,.....
trataré de explicarme

esto tienes en tu html

<link rel="stylesheet" href="../estilosdos.css"type="text/css" media="all">

que significa eso???? le estás diciendo..... ../(salte de esta carpeta) y entra en el documento estilosdos.css ahi... están los codigos css que deberás leer

bien... hasta ahi vamos perfecto
tu html estará leyendo eso solamente

luego en el css (estilosdos.css) le dices

#menu h1 {text-decoration:none ; font-size:12px ;
background-image: url(objetos/menu-uno.png);}

que busque una carpeta llamada objetos.....
ok... donde está esa carpeta?????
no la encuentra junto a estilosdos.... ya que ahi no está.....
por eso no te pone la imagen
debes indicarle exactamente donde encontrarla (por eso se llaman rutas)

ok, le dices algo asi

ve a la carpeta videos, dentro de ella, encontrarás la carpeta objetos, y dentro de ella la imagen X

sabes como decirle eso con codigos??????
seria algo asi

videos/objetos/menu-uno.png

saludos