no se ve el fondo de la imagen

hola a todos porfavor necesito ayuda con la hoja de estilos porque a mi no me sale nada

index.htlm

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<title>Pagina Principal del Ejemplo CCTW</title>
<link rel="stylesheet" href="estilos.css" type="text/css"media="all" />


</head>
<body>



Bienvenidos a me página web. Muy pronto estará lista!</p>


Página creada gracias a CCTW</p>
</body>
</html>
estilos.css
body {background-color: #E6E6FA ; background-image: url(objetos/fondo.png) ; background-repeat: no-repeat }

y la carpeta de objetos esta uvicada en el escritorio>mis-paginas-web>web-ejemplo-cctw<objetos
pero cuando salvo no se ve nada esta igual q antes.
que es lo q twengo mal mpuesto, por fa ayuda.
saludo2
yocoloco21 escribió:hola a todos porfavor necesito ayuda con la hoja de estilos porque a mi no me sale nada

index.htlm

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<title>Pagina Principal del Ejemplo CCTW</title>
<link rel="stylesheet" href="estilos.css" type="text/css"media="all" />


</head>
<body>



Bienvenidos a me página web. Muy pronto estará lista!</p>


Página creada gracias a CCTW</p>
</body>
</html>
estilos.css
body {background-color: #E6E6FA ; background-image: url(objetos/fondo.png) ; background-repeat: no-repeat }

y la carpeta de objetos esta uvicada en el escritorio>mis-paginas-web>web-ejemplo-cctw<objetos
pero cuando salvo no se ve nada esta igual q antes.
que es lo q twengo mal mpuesto, por fa ayuda.
saludo2
Por el foro aprendí que si el color de fondo no sale, es que está mal la relacion de la hoja de istilo con la pagina, pero si es la imagen de fondo la que no sale es porque está mal la ruta o la extencion de la imagen.

entra en el foro y dale clic al logo del foro que hay arriba para que te lleva ea la pagina del curso, cuando estes en la paginna del curos le das clic adonde dice en azul Curso Completo Paso a Paso
se te abrira otra ventyana y le haces clica la pestaña que se llama Herramientas Utiles
se te abrirá la ventana que se llama Herramientas Utiles para tu Pagina Web, por allí un poco mas abajo hay un enlace que se llama "Imágenes", le haces clic a ese enlace y te abrirá una ventana que a la izquierda tiene un menu qyew se llama Imágenes para tus Páginas. Le haces clic en la ppesta´ña donde dice Fondos de Paginas y te abrirá una ventana con muchos fondos de imagenes
algunos son con la extencion .jpg, otros .png otros .gif
Le haces clic derecho a cualquiera de las imagenes y te dirá Guardar imagen como, le haces clic y te abrirá la ventana donde abajo en Nombre sale el nombre de la imagen junto con la extension , a veces solo sale el nombre nada mas, pero abjo en donde dice Tipo verás que extencion tiene
te fijas como se llama y que extencion tiene y haces clic en Guardar. NO CAMBIES NADA solo haces clic en Guardar y fijate de guardarla en una carpeta en que puedas encontrarla.
Cierra todo y vas a la carpeta y ves como se llama la imagen
Entonces la pasas a la carpeta objetos y abres tu hoja de estiloo y donde hay que poner el nombre , pones el nombre de la imagen seguido de la extencion
background-image:url(objetos/nombredeimagen.jpg);
Eso si la que te bajaste tiene la extencion jpg por eso cuando la bajas tienes que fijarte como se llama y que extencion tiene para que en la hoja de estilo la pongas igual
Las imagenes tienen nombre y tienen extencion o formato y las extenciones pueden ser .jpg o .png o .gif y otras que no me acuerdo, por eso fijate bien para que despues lo pongas igual en la hoja de estilo
esto lo aoprendi leyendo los spot de raulyure y de otros
espero haberter ayudado en algo
Estoy para aprender
:o hola Abrahan Gonzalez, gracias por tu interes, ya he hecho lo q me has dicho tu y sigue sin salir nada, a mi me extrañaba q fuera el formato de la imagen ya q yo algo entiendo de eso y te puedo decir, q yo tanto ahora como antes tenia el mismo formato de archivo tanto en la carpeta de objetos como en la hoja de estilos, esta vez la baje en formato .gif y tambien lo canbie en la hoja de estilos la imagen se llama fongo.gif tanto en la carpeta de objetos como en la hoja de estilos, yo menejo un poquito los formatos de los archivos y si la guardo, guardar como..... la puedo guardar en cualquier de los formatos q se puede quardar una imgen, pero ese no es el problema, ahy, ahy otro problema q no es el de el formato,
gracias por tu colavoracion, segire buestros consejos
y un saludo
hola:revise la relacion de su hoja de estilo tiene que quedarle asi como le muestro y tiene que darle los espacios donde los lleva y esto le sobra un (/)
<link rel="stylesheet" href="estilos.css" type="text/css" media="all">
saludos.
hola, gracias Fernado, ese si era el problema, era q no estaba bien la relacion de la hoja de estilos, muchisimas gracias Fernado.
saludos de
yocoloco
fernando mendoza escribió:hola:revise la relacion de su hoja de estilo tiene que quedarle asi como le muestro y tiene que darle los espacios donde los lleva y esto le sobra un (/)
<link rel="stylesheet" href="estilos.css" type="text/css" media="all">
saludos.
Gracias fernadno por tu aclaracion, yo supuse que el color de fondo si le aparecia, por eso no le di mas explicacion de eso y me centré en lo de la imagen de fondo, pero veo que tenia que haberme fijado mas en la relacion de la pagina
Un saludo
Estoy para aprender
Hola! A todos a ver si alguien me puede ayudar porque me han salido algunos problemas y no se como solucionarlos, el caso es que estoy con la “plantilla.html".
Y uno de los problemas es que me ha desaparecido, las letras de:
Este es el pié de la página, antes las tenia, pero ahora han desaparecido.
Otro de los problemas es que tanto la frase de:
Está será la zona principal de la web. Como: Este es el pié de la página:
Me salen con enlace, quiero decir q cuando paso el cursor por encima de ellas se convierte en una mano, pero si yo solo les di ruta a los enlaces porque esas dos frases me salen como enlaces:
El problema de los enlaces ya lo llevo arrastrando lecciones a tras, y esperando a ver si desaparecían pero na, voy avanzando lecciones y no desaparecen, y horita voy . Dar Formato a Cero. Y cuando me doy cuenta de que las letras de: Este es el pié de la página, habían desaparecido.


Plantilla.htlm

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>

<title>Tus Perfumes</title>
<link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
</head>
<body>
<div id="global">
<div id="cabecera">Bienvenidos a MI Web</div>
<div id="navegacion">Barra de navegacion</div>
<div id="contenido">
<div id="menu">
<ul>
  • <a href="#">Enlace 1
  • <a href="#">Enlace 2
  • <a href="#">Enlace 3

    </div>
    Esta será la zona principal de la web
    </div>
    <div id="pie">Este es el Pié de Página</div>
    </div>




    </body>
    </html>


    estilo-general.css
    body {text-align: center }
    #global {width:800px ; margin:4px auto }
    #cabecera {background-color: pink }
    #navegacion {background-color: gray }
    #contenido {background-color: orange }
    #pie {background-color: brown }
    #menu {background-color: yellow ; width: 150px ; flota:left }
    #menu {background-color: yellow; width: 150px ; float:left ; text-align:left }
    #contenido {background-color: orange ; width: 800px ; flota:feft }
    #menu li { list-style:none }
    * {margin:0px ; padding:0px ; border:0px}
    #menu li {list-styles:none ; margin: 4px 0px 4px 6px}
    a {color: blue; font-size:1.3em ; text-decoration:none}
    a {color: brown ; text-decoration:none}
    a:link {}
    a:visited {}
    a:hover {color:red ; text-decoration:underline}
    a: {}



    por favor a ver si alguien le hecha un vistazo y me dice donde están los problemas ya que yo no doy con ellos.
    Que es lo q está mal??

    Gracias y saludos de
    yocoloco
  • hola tiene varios errores que corregir falta el cierre del enlace
    <ul>
  • Enlace 1
  • Enlace 2
  • Enlace 3

    </div>

    en etilos general la palabra flota no existe tiene que ser float

    #menu {background-color: yellow ; width: 150px ; flota:left }

    #contenido {background-color: orange ; width: 800px ; flota:feft }

    falta: la palabra display:block

    a:hover {color:red ; text-decoration:underline ; display:block }

    saludos.
  • Hola! A ver si alguien me puede ayudar no me coge ni la imagen de la curva superior ni la imagen de la curva inferior, por más q lo he intentado y no hay forma,
    A ver si alguien me puede echar una manita gracias.

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <html>
    <head>
    <title>Perfumes</title>
    <link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
    </head>
    <body>
    <div id="global">
    <div id="curva-superior"></div>
    <div id="cabecera">Bienvenidos a mi Web</div>
    <div id="navegacion">Barra de Navegación</div>
    <div id="contenido">
    <div id="menu">
    <ul>
  • Enlace 1
  • Enlace 2
  • Enlace 3</lu>




    </div>
    <h1>Esta será la zona principal de la web</h1>


    Está será una explicación breve de lo que son los perfumes que te puedes encontrar en nuestra web, como puedes ver los perfumes no son de imitación</p>
    <h2>Y esté es mi tercer párrafo</h2>


    Puedes encontrar unos precios muy variados dependiendo de cada bolsillo, pero que nosotros tratamos de ajustarlos lo mejor posibe a cada las necesidades de cada uno</p>
    </div>
    <div id="pie">Este es el pié de página</div>
    <div id="pie">Este es el pié de página</div>
    </div>
    </body>
    </html>




    body {text-align: center}
    #global {width:800px ; margin: 4px auto }
    #cabecera {background-color: white ; border-left: black 1px solid ; boreder-right: black 1px solid }
    #navegacion {background-color: gray ; border:black 1px solid }
    #contenido {background-color: orange }
    #menu {background-color: yellow; width: 150px ; float:left }
    #pie {background-color: brown ; border: black 1px solid }
    #contenido {background-color: orange ; float:left ; border-left: black 1px solid ; border-right: black 1px solid}
    #menu li { list-style:none }
    * {margin:0px ; padding:0px ; border: 0px}
    #menu {background-color: yellow ; width: 150px ; float:left ; text-align:left ; margin-right: 10px }
    #menu li {list-style:none ; margin: 4px 0px 4px 6px}
    a {color: blue; font-size:1.1em ; text-decoration: none}
    a {color: brown ; text-decoration:none}
    a:link {}
    a:visited {}
    a:hover {color:red ; text-decoration:underline ; background-color:silver}
    a:active {}
    a {color: brown ; text-decoration:none ; dislay:block }
    p {text-align: justify}
    #contenido p {padding: 5px 10px 5px 10px ; text-indent: 15px }
    #menu {.................. margin:3px 10px 3px 3px}
    h1 {font-size: 1.2em; color:blue ; font-weight: bold ; text-decoration: underline ; text-align: center}
    h2 {font-size: 1.1em; color:blue ; font-weight: bold ; text-decoration: none ; text-align: center}
    h1 {text-align: left }
    h2 {text-align: right }
    #curva-superior { background-image: url(objetos/curva-superior.gif) ;
    background-repeat: no-repeat ;
    width:800px ;
    height: 12px ;
    overflow : hidden }
    #cabecera { background-color: white ; border-left: black 1px solid ; border-right: black 1px solid }
    #curva-inferior { background-image: url(objetos/curva-inferior.gif) ;
    background-repeat: no-repeat ;
    width:800px ;
    height: 12px
    overflow: hidden }



    Dónde está el error, porque yo no lo entiendo porque no me coge las imágenes , estas estan en la carpeta de objetos> web-ejemplos-cctw-intarnet.
    Guardadas en formato .gif.
    Gracias y saludo2
  • yocoloco escribió:Hola! A ver si alguien me puede ayudar no me coge ni la imagen de la curva superior ni la imagen de la curva inferior, por más q lo he intentado y no hay forma,
    A ver si alguien me puede echar una manita gracias.
    Dónde está el error, porque yo no lo entiendo porque no me coge las imágenes , estas estan en la carpeta de objetos> web-ejemplos-cctw-intarnet.
    Guardadas en formato .gif.
    Gracias y saludo2

    Hola

    Tienes que tener cuidado con los errores que por muy pequeños que sean no te mostrarán las cosas como deben.
    Esto está en tu pagina html:

    Acá has cerrado el pero le has puesto </lu>
    ----<div id="menu">
    <ul>
  • Enlace 1
  • Enlace 2
  • Enlace 3</lu>----Tiene que ser ul

    También el <div id="pie">Este es el pie de pagina</div> lo tienes repetido, debes eliminar uno de ellos

    Ahora Esto es tu hoja de estilo general

    Acá a la cabecera le has puesto boreder-right y tiene que ser border-right

    Luego la capa #contenido la tienes repetida, elimina la que dice #contenido{background-color:orange}
    Más abajo otra vez tienes la capa cabecera.


    Así es muy dificil que las cosas te salgan, es importante llevar un orden en la hoja de estilo.
    Debes tener tu hoja de estilo más o menos así:
    La primera linea en la hoja de estilo es la del asterisco, por ejemplo:

    * {margin:0px ; padding:0px ; border: 0px}
    h1 {font-size: 1.2em; color:blue ; font-weight: bold ; text-decoration: underline ; text-align: center}
    h2 {font-size: 1.1em; color:blue ; font-weight: bold ; text-decoration: none ; text-align: center}
    p {text-align: justify}
    body {text-align: center}
    #global {width:800px ; margin: 4px auto }
    #curva-superior { background-image: url(objetos/curva-superior.gif) ;
    background-repeat: no-repeat ;
    width:800px ;
    height: 12px ;
    overflow : hidden }
    #cabecera {background-color: white ; border-left: black 1px solid ; border-right: black 1px solid }
    #navegacion {background-color: gray ; border:black 1px solid }
    #contenido {background-color: orange ; float:left ; border-left: black 1px solid ; border-right: black 1px solid}
    #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 li{list-style:none;margin:4px 0px 4px 6px}
    #pie {background-color: brown ; border-left: black 1px solid;border-right:black 1px solid;border-top:black 1px solid;height:65px; }
    #curva-inferior { background-image: url(objetos/curva-inferior.gif) ;
    background-repeat: no-repeat ;
    width:800px ;
    height: 12px
    overflow: hidden }
    a {color: brown ; text-decoration:none;display:block}
    a:link {}
    a:visited {}
    a:hover {color:red ; text-decoration:underline ; background-color:silver}
    a:active {}
  • Estoy para aprender
    Hola! Abrahan:
    Gracias por contestar tan pronto:
    Lo he puesto como tu me has indicado pero sigue sin coger las imágenes de las curvas, tanto la superior como la inferior.
    Aquí te dejo la dirección para q tu mismo la puedas ver.
    Otra duda q tengo, esto tu los puesto a si y yo tan bien pero tengo una curiosidad.


    #pie {background-color: brown ; border-left: black 1px solid;border-right:black 1px solid;border-top:black 1px solid;height:65px; }


    No debería de ser a sí con los espacios
    #pie {background-color; brown ; border-left: black 1px solid ; border-right:black 1px solid ; border-top:black 1px solid ; height:65px }

    Y este, punto y como del final a mi no me cuadra:
    Quiero q me digas si realmente es asi.

    solid;height:65px; }


    está es mi web para q veas como queda:


    http://lamusicademax.myartsonline.com/plantilla.html


    esto es lo q tengo ahora puesto como tu me has dicho oki…



    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <html>
    <head>
    <title>Perfumes</title>
    <link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
    </head>
    <body>
    <div id="global">
    <div id="curva-superior"></div>
    <div id="cabecera">Bienvenidos a mi Web</div>
    <div id="navegacion">Barra de Navegación</div>
    <div id="contenido">
    <div id="menu">
    <ul>
  • Enlace 1
  • Enlace 2
  • Enlace 3




    </div>
    <h1>Esta será la zona principal de la web</h1>


    Está será una explicación breve de lo que son los perfumes que te puedes encontrar en nuestra web, como puedes ver los perfumes no son de imitación</p>
    <h2>Y esté es mi tercer párrafo</h2>


    Puedes encontrar unos precios muy variados dependiendo de cada bolsillo, pero que nosotros tratamos de ajustarlos lo mejor posibe a cada las necesidades de cada uno</p>
    </div>
    <div id="pie">Este es el pié de página</div>

    </div>
    </body>
    </html>




    * {margin:0px ; padding:0px ; border: 0px}
    h1 {font-size: 1.2em; color:blue ; font-weight: bold ; text-decoration: underline ; text-align: center}
    h2 {font-size: 1.1em; color:blue ; font-weight: bold ; text-decoration: none ; text-align: center}
    p {text-align: justify}
    body {text-align: center}
    #global {width:800px ; margin: 4px auto }
    #curva-superior { background-image: url(objetos/curva-superior.gif) ;
    background-repeat: no-repeat ;
    width:800px ;
    height: 12px ;
    overflow : hidden }
    #cabecera {background-color: white ; border-left: black 1px solid ; border-right: black 1px solid }
    #navegacion {background-color: gray ; border:black 1px solid }
    #contenido {background-color: orange ; float:left ; border-left: black 1px solid ; border-right: black 1px solid}
    #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 li{list-style:none;margin:4px 0px 4px 6px}
    #pie {background-color: brown ; border-left: black 1px solid;border-right:black 1px solid;border-top:black 1px solid;height:65px; }
    #curva-inferior { background-image: url(objetos/curva-inferior.gif) ;
    background-repeat: no-repeat ;
    width:800px ;
    height: 12px
    overflow: hidden }
    a {color: brown ; text-decoration:none;display:block}
    a:link {}
    a:visited {}
    a:hover {color:red ; text-decoration:underline ; background-color:silver}
    a:active {}

    Saludos y Gracias
  • yocoloco escribió:Hola! Abrahan:
    Gracias por contestar tan pronto:
    Lo he puesto como tu me has indicado pero sigue sin coger las imágenes de las curvas, tanto la superior como la inferior.
    Aquí te dejo la dirección para q tu mismo la puedas ver.
    Otra duda q tengo, esto tu los puesto a si y yo tan bien pero tengo una curiosidad.


    #pie {background-color: brown ; border-left: black 1px solid;border-right:black 1px solid;border-top:black 1px solid;height:65px; }


    No debería de ser a sí con los espacios
    #pie {background-color; brown ; border-left: black 1px solid ; border-right:black 1px solid ; border-top:black 1px solid ; height:65px }

    Y este, punto y como del final a mi no me cuadra:
    Quiero q me digas si realmente es asi.

    solid;height:65px; }


    está es mi web para q veas como queda:


    http://lamusicademax.myartsonline.com/plantilla.html


    esto es lo q tengo ahora puesto como tu me has dicho oki…





    Saludos y Gracias

    Hola yocoloco.
    En la capa pie hay que ponerle un borde a la izquierda un borde a la derecha y un borde arriba osea left, right y top, (así como te lo puse en el ejemplo anterior) porque el borde que iría abajo , lo ocupará la imagen de la curva inferior
    Tiene que ir todo junto excepto entre el, black el 1px y el solid que debe haber un espacio entre ellos.

    No te confundas poniendo punto y coma donde debe llevar los dos puntos
    #pie{background-color:white;border-left:black 1px solid;border-right:black 1px solid;border-top:black 1px solid;height:65px}

    Allí donde dice black 1px solid debe haber un espacio porque son tres palabras diferentes, el punto y coma que va al final de todo, (justo antes de la llave de cierre puedes ponerlo o no.
    ejemplo
    height:65px;} o height:65px}

    Si las imagenes de las curvas superior y la inferior no te aparecen, primero hay que ver si las has subido a la carpeta objetos del hosting,
    segundo: a lo mejor la terminación .gif te ha quedado como parte del nombre de la imagen, (cuando la bajaste te pudiste equivocar)
    Así que a lo mejor la imagen se llama curva-superior.gif.gif
    Prueba poniendo en tu hoja de estilo allí donde pusiste la capa curva superior un .gif más

    #curva-superior {background-image:url(objetos/curva-superior.gif.gif);
    background-repeat: no-repeat ;
    width:800px ;
    height: 12px ;
    overflow : hidden }

    Lo mismo haz en la curva inferior

    #curva-inferior { background-image: url(objetos/curva-inferior.gif.gif) ;
    background-repeat: no-repeat ;
    width:800px ;
    height: 12px
    overflow: hidden}
    Estoy para aprender
    Hola! Abrahan ya lo he puesto como tu me dices, pero yo creo q ese no es el problema, las imágenes están Escritorio web-ejemplos-cctw-internet< objetos.
    Y están guardadas en formato .gif.
    Eh dado sobre ellas propiedades y me dice q están en formato .gif, y no están guardadas, como curva-superior.gif.gif,
    Están guardadas como curva-superior.gif, ésta y la otra.
    Yo creo q el problema va a estar en el código de la plantilla.html, y no en la hoja de estilos, claro q eso solo es lo q yo supongo, pero yo no se mucho de todo esto, y supongo q tu sabes más.
    Pero eh hecho algunos cambios y na de na.
    Y lo he dejado como lo tenía.
    No se donde puede estar el problema el caso es q no las coje.
    Gracias y saludos
    yocoloco escribió:Hola! Abrahan ya lo he puesto como tu me dices, pero yo creo q ese no es el problema, las imágenes están Escritorio web-ejemplos-cctw-internet< objetos.
    Y están guardadas en formato .gif.
    Eh dado sobre ellas propiedades y me dice q están en formato .gif, y no están guardadas, como curva-superior.gif.gif,
    Están guardadas como curva-superior.gif, ésta y la otra.
    Yo creo q el problema va a estar en el código de la plantilla.html, y no en la hoja de estilos, claro q eso solo es lo q yo supongo, pero yo no se mucho de todo esto, y supongo q tu sabes más.
    Pero eh hecho algunos cambios y na de na.
    Y lo he dejado como lo tenía.
    No se donde puede estar el problema el caso es q no las coje.
    Gracias y saludos
    Hola yocoloco:

    Hay una cosa que hemos pasado por alto
    tu en tu html tienes <div id="curva-superior"></div> ¿No es cierto?

    Pero debajo de la capa pie debieras de tener una que diga <div id="curva inferior"></div> y esa no la tienes puesta.
    Allí debajo de la capa pie tienes que poner la capa de la curva inferior.

    Ahora te recomiendo que vuelvas al curso (seccion 3 en redondear esquinas) y ve a donde está la imagen de la curva superior le pulsas boton derecho y le das a guardar como, no le cambies nada (solo fijate que en la casilla donde dice nombre diga el nombre y la extension, y la guardas.
    Lo mismo haces con la curva inferior, y luego pones esas en la carpeta objetos que está en tu escritorio (para que remplacen a las otras).

    Luego las subes al hosting.
    recuerda no hacer vista previa en la carpeta azul, que la carpeta azul es solo para subir no para hacer vista previa

    fuera de eso fijate que tu carpeta se llame exactamente de la misma manera de como le pones en tu hoja de estilo general, no vaya a ser que tu carpeta se llame Objetos (con la O mayúscula) y tu le pongas en tu hoja de estilo objetos (con la o minúscula) y por eso sea que no te las deja ver.
    Si tu carpeta se llama Objetos, pues en todas partes a que hagas referencia a ella debes ponerle Objetos.
    Si se llama objetos, pues en todas partes debes ponerle objetos

    En la hoja de estilo general
    a la capa contenido ponle un width:800px;
    #contenido{width:800px;background-color:etc. etc. etc. etc.}

    Y por ahora escribe todas las cosas sin tilde o acento, porque ya verás mas adelante en el curso que hay un código para que se vean bien los acentos

    Pero haz los cambios porque si te voy indicando algunas cosas yo voy a suponer que los has hecho
    Estoy para aprender
    Hola! Abrahan: ya he hecho todo lo q me has dicho, he bajado otra ves las dos imágenes, no les he cambiado nada solo q el formato decía en .gif, ya las he subido al hosting, y he retocado la capa contenido.
    Asi

    #navegacion {background-color: gray ; border:black 1px solid }
    #contenido {width:800px;background-color: orange ; float:left ; border-left: black 1px solid ; border-right: black 1px solid}
    #contenido p {padding: 5px 10px 5px 10px ; text-indent: 15px }

    y la plantilla.html
    así:

    <div id="pie">Este es el pié de página</div>
    <div id="curva-inferior"></div>



    Pero no se q es lo q pasa, q sigue sin subir las imagines de las curvas, el otro día intente subir la sonrisa y si q la subió, y luego la volví a quitar a si q hay algo q no funciona.
    Gracias por tu dedicación, y se q te estoy dando trabajo, pero no creí yo q esto fuera así de difícil, o por lo menos q nos está dando por el saco a los dos.
    Gracias y saludo2
    yocoloco escribió:Hola! Abrahan: 2
    Hola yocoloco
    Te voy a dejar acá los códigos de como tienes que tener tu hoja de estilo y de como tienes que tener tu pagina html.

    En tu carpeta que tienes en tu escritorio, abre tu hoja de estilo general, (le das clic derecho al archivo y eliges abrir con y eliges bloc de notas, cuando esté abierta eliminas todo lo que hay y pegas estos códigos

    *{text-indent:0px;margin:0px ; padding:0px ; border: 0px}
    h1 {font-size: 1.2em; color:blue ; font-weight: bold ; text-decoration: underline ; text-align: center}
    h2 {font-size: 1.1em; color:blue ; font-weight: bold ; text-decoration: none ; text-align: center}
    p {text-align: justify}
    body {text-align: center}
    #global {width:800px ; margin: 4px auto }
    #curva-superior { background-image: url(objetos/curva-superior.gif) ;
    background-repeat: no-repeat ;
    width:800px ;
    height: 12px ;
    overflow : hidden }
    #cabecera {background-color: white ; border-left: black 1px solid ; border-right: black 1px solid }
    #navegacion {background-color: gray ; border:black 1px solid }
    #contenido {width:auto;background-color: orange ; float:left ; border-left: black 1px solid ; border-right: black 1px solid;}
    #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 li{list-style:none;margin:4px 0px 4px 6px}
    #pie {background-color:red ;border-left:black 1px solid;border-right:black 1px solid;border-top:black 1px solid;}
    #curva-inferior{background-image:url(objetos/curva-inferior.gif) ;
    background-repeat: no-repeat ;
    width:800px ;
    height:12px;
    overflow:hidden}
    a {color: brown;text-decoration:none;display:block}
    a:link {}
    a:visited {}
    a:hover {color:red ; text-decoration:underline ; background-color:silver}
    a:active {}

    Luego guardas

    ahora haces lo mismo con tu pagina plantilla le haces clic derecho/abrir con/bloc de notas

    cuando la tengas abierta borras todo lo que hay allí y pegas estos códigos

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <html>
    <head>
    <title>Perfumes</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
    </head>
    <body>
    <div id="global">
    <div id="curva-superior"></div>
    <div id="cabecera">Bienvenidos a mi Web</div>
    <div id="navegacion">Barra de Navegación</div>
    <div id="contenido">
    <div id="menu">
    <ul>
  • Enlace 1
  • Enlace 2
  • Enlace 3




    </div>
    <h1>Esta será la zona principal de la web</h1>


    Está será una explicación breve de lo que son los perfumes que te puedes encontrar en nuestra web, como puedes ver los perfumes no son de imitación</p>
    <h2>Y esté es mi tercer párrafo</h2>


    Puedes encontrar unos precios muy variados dependiendo de cada bolsillo, pero que nosotros tratamos de ajustarlos lo mejor posibe a cada las necesidades de cada uno</p>

    </div>
    <div id="pie">Este es el pie de página</div>
    <div id="curva-inferior"></div>

    </div>
    </body>
    </html>



    Despues que hayas hecho todo eso, abres el html kit, conectas la carpeta azul y le das upload al index para que suba
    Luego que ha subido, cierras el programa html-kit y lo vuelves a abrir y ahora conectas otra vez la capeta azul y le das upload a la plantilla.
    cierras el programa otra vez y vuelves a abrirlo para ahora subir la hoja de estilo general
    con las imagenes haces lo mismo, las vuelves a subir.
    Esto que te digo es para asegurar que los archivos suben bien (después no hay necesidad de hacerlos uno por uno

    Es importante saber cual version de sistema operativo tienes
    para decirte como borrar los archivos temporales, ya que puede que estén también molestando

    ¿Tienes XP o tienes Vista?.
    Es que se borran de diferente manera
    mi correo es [correo eliminado]
    Por allí te puedo ayudar mejor, y despues ponemos acá en los spot la manera de como lo arreglamos
  • Estoy para aprender
    yocoloco escribió:Hola! Abrahan: ya he hecho todo lo q me has dicho, he bajado otra ves las dos imágenes, no les he cambiado nada solo q el formato decía en .gif, ya las he subido al hosting, y he retocado la capa contenido.
    Asi

    #navegacion {background-color: gray ; border:black 1px solid }
    #contenido {width:800px;background-color: orange ; float:left ; border-left: black 1px solid ; border-right: black 1px solid}
    #contenido p {padding: 5px 10px 5px 10px ; text-indent: 15px }

    y la plantilla.html
    así:

    <div id="pie">Este es el pié de página</div>
    <div id="curva-inferior"></div>



    Pero no se q es lo q pasa, q sigue sin subir las imagines de las curvas, el otro día intente subir la sonrisa y si q la subió, y luego la volví a quitar a si q hay algo q no funciona.
    Gracias por tu dedicación, y se q te estoy dando trabajo, pero no creí yo q esto fuera así de difícil, o por lo menos q nos está dando por el saco a los dos.
    Gracias y saludo2

    Hola yocoloco
    tienes que ir al foro Curso Paso a Paso con HTML_KIT y en la seccion de Preguntas Frecuentes hay un spot que dice "No puedo subir nada a la web, no logro la conexion"
    pulsas en el enlace y allí te dice como entrar al panel de tu web por medio de Razy
    Así revisas si todo está bien subido y ver donde tienes tus carpetas
    Estoy para aprender
    yo ya me dare por derrotado, ya lo realicew una y otra y otra ves y no me sale todo se me mal acomoda en el menu.



    yocoloco21 escribió:hola a todos porfavor necesito ayuda con la hoja de estilos porque a mi no me sale nada

    index.htlm

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

    <html>
    <head>
    <title>Pagina Principal del Ejemplo CCTW</title>
    <link rel="stylesheet" href="estilos.css" type="text/css"media="all" />


    </head>
    <body>



    Bienvenidos a me página web. Muy pronto estará lista!</p>


    Página creada gracias a CCTW</p>
    </body>
    </html>
    estilos.css
    body {background-color: #E6E6FA ; background-image: url(objetos/fondo.png) ; background-repeat: no-repeat }

    y la carpeta de objetos esta uvicada en el escritorio>mis-paginas-web>web-ejemplo-cctw<objetos
    pero cuando salvo no se ve nada esta igual q antes.
    que es lo q twengo mal mpuesto, por fa ayuda.
    saludo2
    arkan111
    arkan111 escribió:yo ya me dare por derrotado, ya lo realicew una y otra y otra ves y no me sale todo se me mal acomoda en el menu.



    yocoloco21 escribió:hola a todos porfavor necesito ayuda con la hoja de estilos porque a mi no me sale nada

    index.htlm

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

    <html>
    <head>
    <title>Pagina Principal del Ejemplo CCTW</title>
    <link rel="stylesheet" href="estilos.css" type="text/css"media="all" />


    </head>
    <body>



    Bienvenidos a me página web. Muy pronto estará lista!</p>


    Página creada gracias a CCTW</p>
    </body>
    </html>
    estilos.css
    body {background-color: #E6E6FA ; background-image: url(objetos/fondo.png) ; background-repeat: no-repeat }

    y la carpeta de objetos esta uvicada en el escritorio>mis-paginas-web>web-ejemplo-cctw<objetos
    pero cuando salvo no se ve nada esta igual q antes.
    que es lo q twengo mal mpuesto, por fa ayuda.
    saludo2

    No te desanimes que a casi todos nos ha pasado lo mismo.
    Péganos acá todos los códigos que tienes en tu hoja de estilo general y todos los que tienes en tu pagina plantilla.
    O si no has llegado todavía a crear la plantilla, peganos todos los codigos de tu hoja de estilo.css y los de tu index
    Estoy para aprender
    HOLA:
    La verdad es que estais recien comenzado y ya quereis er la pagina funcionando yo recomendaria lo primero leer y entender lo leido.
    lo segundo tener conciencia de que las explcaciones ademas de sencillas son GENIALES.
    Lo tercero que hay que tener paciencia que hacer y deshacer todo es "quiacer"
    Como noser y tener el aguante para si no encontrais los fallos ponerlos en el FORO.
    Si yo he sido capaz de hacer mi PAGINA PASO A PASO, cualquiera es capaz de hacerla

    Y por ultimo os dire que aquellos escritos, o instrucciones, que en las lecciones son o estan en azul van a la PLANTILLA y las verdes van en la HOJA DE ESTILOS.CSS

    ESPERO HABER SIDO DE AYUDA

    UN SALUDO: SARUMAN
    Es ESENCIAL en este mundo, para no crear vagos ENSEÑAR
    bueno segun yo estoy bien pero cuando veo el previw nada que ver con el que aparece de ejemplo, ya estube comparando lo que tengo yo con lo que esta en la pag y esta igualitos, no se que pase, pero pues la verdad como es lo mismo borre el mio y pehge el de ustesdes jejejeje joder despues de estar toda una mañana haciendolo 3 ocaciones y despues revisandolo con el ejemplo y encontrar que son iguales, pues bueno opte por dejarlo, una de mis dudas es los espacios que les dan que no explican sin embargo aparecen tienen algo que ver ?


    abrahan gonzalez escribió:
    arkan111 escribió:yo ya me dare por derrotado, ya lo realicew una y otra y otra ves y no me sale todo se me mal acomoda en el menu.



    yocoloco21 escribió:hola a todos porfavor necesito ayuda con la hoja de estilos porque a mi no me sale nada

    index.htlm

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

    <html>
    <head>
    <title>Pagina Principal del Ejemplo CCTW</title>
    <link rel="stylesheet" href="estilos.css" type="text/css"media="all" />


    </head>
    <body>



    Bienvenidos a me página web. Muy pronto estará lista!</p>


    Página creada gracias a CCTW</p>
    </body>
    </html>
    estilos.css
    body {background-color: #E6E6FA ; background-image: url(objetos/fondo.png) ; background-repeat: no-repeat }

    y la carpeta de objetos esta uvicada en el escritorio>mis-paginas-web>web-ejemplo-cctw<objetos
    pero cuando salvo no se ve nada esta igual q antes.
    que es lo q twengo mal mpuesto, por fa ayuda.
    saludo2

    No te desanimes que a casi todos nos ha pasado lo mismo.
    Péganos acá todos los códigos que tienes en tu hoja de estilo general y todos los que tienes en tu pagina plantilla.
    O si no has llegado todavía a crear la plantilla, peganos todos los codigos de tu hoja de estilo.css y los de tu index
    arkan111
    Hola! Brahan, ya he solucionado el problema de las imágenes de las curvas, no me digas como, q no tengo ni idea, he tocado tantas cosas q no se lo q he hecho pero bueno ahora si q las coge.
    He avanzado un poco pero ahora tengo otro problema y es q no le hace flotar al logotipo y a la publicidad no van a si sitio, el logotipo ocupa toda la página y debajo se queda lo de:
    Bien venidos a mi web.

    Cuando el logotipo debería quedar a la izquierda y lo de Bienvenido a la derecha:
    No sé q es lo q he puesto mal, de veras q lo he repasado unas cuantas veces, pero como hay veces q uno por muchas veces q lo mire no ve el fallo sin embargo lo mira otra persona q esta mas relajada, o q sabe mas y da con el fallo.

    Esto es lo q tengo en la ( plantilla.htlm y el la hoja de estilos.css


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <html>
    <head>
    <title>Perfumes</title>
    <link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
    </head>
    <body>
    <div id="global">
    <div id="curva-superior"></div>
    <div id="cabecera">
    <div id="logotipo">
    [contenido no disponible]

    </div>
    <div id="publicidad">Bienvenidos a mi Web</div>
    <div id="navegacion">Barra de Navegación</div>
    <div id="contenido">
    <div id="menu">
    <ul>
  • Enlace 1
  • Enlace 2
  • Enlace 3</lu>




    </div>
    <h1>Esta será la zona principal de la web</h1>


    Está será una explicación breve de lo que son los perfumes que te puedes encontrar en nuestra web, como puedes ver los perfumes no son de imitación</p>
    <h2>Y esté es mi tercer párrafo</h2>


    Puedes encontrar unos precios muy variados dependiendo de cada bolsillo, pero que nosotros tratamos de ajustarlos lo mejor posibe a cada las necesidades de cada uno</p>
    </div>
    <div id="pie">Este es el pié de página</div>
    <div id="curva-inferior"></div>

    </div>
    </body>
    </html>


    body {text-align: center}
    #global {width:800px ; margin: 4px auto }
    #cabecera {background-color: white ; border-left: black 1px solid ; border-right: black 1px solid ; height:85px }
    #navegacion {background-color: gray }
    #contenido {background-color: orange }
    #menu {background-color: yellow; width: 150px ; float:left }
    #pie {background-color: white ;
    border-left: black 1px solid ;
    border-right: black 1px solid;
    border-top: black 1px solid }
    #contenido {background-color: orange ; width: 800px ; float:left}
    #menu li { list-style:none }
    * {margin:0px ; padding:0px ; border: 0px}
    #menu {background-color: yellow ; width: 150px ; float:left ; text-align:left ; margin-right: 10px }
    #menu li {list-style:none ; margin: 4px 0px 4px 6px}
    a {color: blue; font-size:1.1em ; text-decoration: none}
    a {color: brown ; text-decoration:none}
    a:link {}
    a:visited {}
    a:hover {color:red ; text-decoration:underline ; background-color:silver}
    a:active {}
    a {color: brown ; text-decoration:none ; dislay:block }
    p {text-align: justify}
    #contenido p {padding: 5px 10px 5px 10px ; text-indent: 15px}
    #menu {.................. margin:3px 10px 3px 3px}
    h1 {font-size: 1.2em; color:blue ; font-weight: bold ; text-decoration: underline ; text-align: center}
    h2 {font-size: 1.1em; color:blue ; font-weight: bold ; text-decoration: none ; text-align: center}
    h1 {text-align: left }
    h2 {text-align: right }
    #curva-superior { background-image: url(objetos/curva-superior.gif) ;
    background-repeat: no-repet ;
    width:800px ;
    height: 12px ;
    overflow : hidden }
    #curva-inferior { background-image: url(objetos/curva-inferior.gif) ;
    background-repeat: no-repeat ;
    width:800px ;
    height: 12px;
    overflow: hidden )
    #logotipo {background-color: brown ; width:280px ; float:left }
    #publicidad {background-color: pink ; width:518px ; float:right ; margin-tpo:25px }


    Gracias por tu ayuda Brahan y
    Saludo2

  • yocoloco escribió:Hola! Brahan, ya he solucionado el problema de las imágenes de las curvas, no me digas como, q no tengo ni idea, he tocado tantas cosas q no se lo q he hecho pero bueno ahora si q las coge.
    He avanzado un poco pero ahora tengo otro problema y es q no le hace flotar al logotipo y a la publicidad no van a si sitio, el logotipo ocupa toda la página y debajo se queda lo de:
    Bien venidos a mi web.

    Cuando el logotipo debería quedar a la izquierda y lo de Bienvenido a la derecha:
    No sé q es lo q he puesto mal, de veras q lo he repasado unas cuantas veces, pero como hay veces q uno por muchas veces q lo mire no ve el fallo sin embargo lo mira otra persona q esta mas relajada, o q sabe mas y da con el fallo.



    Gracias por tu ayuda Brahan y
    Saludo2



    Me alegro que se te vaya solucionando, de a poco irás comprenciendo mejor como funcionan los códigos, pero te voy a decir una cosa (no es un llamado de atención) solo es un consejo para que no vayas teniendo tantos problemas más adelante.
    Siempre que abras una capa o div (es lo mismo)
    debes en algun momento cerrarla.
    Si abres la capa cabecera y luego la cierras, poniendo algo escrito en ella, pues no hay ningun problema
    <div id="cabecera">Esta es la capa cabecera</div>
    O sea la has abierto, has escrito algo y la has cerrado

    Ahora si tu dentro de la capa cabecera metes dos capas mas, que serían la capa logotipo y la capa publicidad lo normal es que la capa logotipo la abras, metes lo que vaya dentro y despues la cierres, luego la capa publicidad, la abres. metes lo que vaya dentro y la cierres. y como las dos capas van adentro de la capa cabecera , lo normal es que después cierres la capa cabecera, y eso es algo que no has hecho.
    Así que esa parte debiera de quedarte así:

    <div id="cabecera">
    <div id="logotipo">
    [contenido no disponible]</div>
    <div id="publicidad">Bienvenidos a mi Web</div>
    </div>
    <div id="navegacion">Barra de Navegación</div>

    Lo que te puse en negrita es la apertura de tu capa cabecera y al final, (justo antes de abrir la capa navegacion) el cierre de tu capa cabecera
    O sea a ti te falta poner ese cierre </div> a la capa cabecera.

    Y recuerda, que en tu hoja de estilo general debes crear la capa logotipo y la capa publicidad y darle las directivas que tienen que tener.
    ¿En qué linea tienes que poner la capa logotipo y la capa publicidad?
    Pues justo que vayan debajo de la capa cabecera
    #cabecera{etc. etc. etc.}
    #logotipo{etc. etc. etc.}
    #publicidad{etc. etc. etc.}

    Sigue adelante que vas muy bien
    Estoy para aprender
    hola, a todos bueno he solucionado un problema pero ahora he intento correr la imagen del logotipo , pero no se mueve con las palabras top center, center botton ; right botton, left top.

    #logotipo {background-color: brown ; width:280px ; float:left }
    #publicidad {background-color: pink; width:518px ; float:right ; margin-top:25px }
    Pero la imagen no se mueve del sitio.


    <div id="global">
    <div id="curva-superior"></div>
    <div id="cabecera">
    <div id="logotipo">
    [contenido no disponible]
    </div>
    <div id="publicidad">Bienvenidos a mi Web</div>
    <div id="navegacion">Barra de Navegación</div>
    <div id="contenido">
    <div id="menu">
    <ul>
  • Enlace 1
  • Enlace 2
  • Enlace 3</lu>




    </div>
    <h1>Esta será la zona principal de la web</h1>


    Está será una explicación breve de lo que son los perfumes que te puedes encontrar en nuestra web, como puedes ver los perfumes no son de imitación</p>
    <h2>Y esté es mi tercer párrafo</h2>


    Puedes encontrar unos precios muy variados dependiendo de cada bolsillo, pero que nosotros tratamos de ajustarlos lo mejor posibe a cada las necesidades de cada uno</p>
    </div>
    <div id="pie">Este es el pié de página</div>
    <div id="curva-inferior"></div>

    </div>
    </body>
    </html>



    A caso hago algo mal??
    Saludo2 y gracias