Hola! Estoy creando una pagina a partir del tutorial, modifincandolo un poco a mi gusto (posición, tamaño, color...) y claro me surgen algunos problemas. Os pongo los estilos y la plantilla:
PLANTILLA:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Page title</title>
<link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
</head>
<body>
<div id="global">
<div id="cabecera">
<div id="logotipo"></div>
<a href="index.html">
[contenido no disponible]</div><div id="navegacion"><ul><a href="#">OTROS <a href="#">MULTIMEDIA<a href="#"> TEXTOS<a href="#"> PRINCIPAL
</div><div id="menu"><ul> Textos Foro Videos Otros Enlaces Imagenes Usuarios Cuentas Más cosas
</div><div id="contenido">
<h1>La publicidad. Texto de prueba.</h1>
Este es el primer parrafo de prueba ....... ....... ......... . ........ ........ ..._______ ______ _______ _______ ______ _____ ______ ______ ______ _______ ______ _____ ______ ________ ___________ ________ _____ ___ ________ ________ ______ ________ ____ _____ _____ _____ _____ ____ ___ __ .............. ............... ....................... ...............</p>
Y este es el segundo parrafo de prueba, que lo relleno todo con _ y . porque en verdad no se que poner :P ....... ....... ......... . ........ ........ ..._______ ______ _______ _______ ______ _____ ______ ______ ______ _______ ______ _____ ______ ________ ___________ ________ _____ ___ ________ ________ ______ ________ ____ _____ _____ _____ _____ ____ ___ __ .............. ............... ....................... ...................... ....... ......... . ........ ........ ..._______ ______ _______ _______ ______ _____ ______ ______ ______ _______ ______ _____ ______ ________ ___________ ________ _____ ___ ________ ________ ______ ________ ____ _____ _____ _____ _____ ____ ___ __ .............. ............... ....................... ...............</
</p>
</div>
<div id="pie"><div id="pie">
<div id="pieuno">pie uno</div>
<div id="piedos">pie dos</div>
<div id="pietres">pie tres</div>
<div id= "creditos">Creado por Gonzalo. </div>
</div></div>
</div>
</body>
</html>
ESTILOS GENERALES:
* {margin:0px ; padding:0px ; border: 0px}
body {background-color: #816f61 ; background-image: url(objetos/diseño web fondo.png); background-repeat: no-repeat ; background-position: top}
img {border-style: none}
#cabecera {background-color: none}
#contenido {background-color: none ; color:red ; width: 800px ; float:left }
#pie {background-color: none; color: black; font.size: 0.9em ; height: 65px ;}
#global {width:800px ; margin: 4px auto}
body {text-align: center}
#menu {background-color: none ; color: #cdb5a2 ; width: 199px ; float:right ; text-align:left; margin: 0px 0px 10px 5px ; background-image: url(objetos/menu vertical.png)}
#menu li { list-style:none; color: #cdb5a2 ;margin: 15px 15px 15px 20px }
a {color: brown; font-size:1.3em ; text-decoration: none}
a:link {}
a:visited {}
a:hover {color:none; text-decoration:none; display: block; background-color: none}
a:active {}
p {text-align: justify}
#contenido p {padding: 0px 250px 0px 30px ; text-indent: 20px}
h1 {font-size: 1.2em; color:blue ; font-weight: bold ; text-decoration: none ; text-align: left}
h2 {font.size: 1.1em; color:blue ; font-weight: bold ; text-decoration: none ; text-align: left}
#logotipo {background-color: none ; float:left ; margin-top:0px; padding: 0px 0px 0px 0px }
#publicidad {background-color: pink ; width:400px ; float:right }
#navegacion { font-weight: bold ; background-color: none ; border: none ; height:30px ; float:right ; padding: 0px 100px 0px 0px }
#navegacion li { float:right ; list-style:none ; margin: 0px 10px 0px 10px }
#navegacion li {color: #cdb5a2}
#pieuno {background-color: none ; float:left ; width:150px }
#piedos {background-color: none ; float:left ; width:498px }
#pietres {background-color: none ; float:left ; width:150px }
#creditos {float: right}
ESTILOS:
body {background-color: #816f61 ; background-image: url(objetos/diseño web fondo.png); background-repeat: no-repeat ; background-position: top}
img {border-style: none}
.centrado {text-align:center}
INDEX:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Equidistantes</title>
<link rel="stylesheet" href="estilos.css" type="text/css" media="all">
</head>
<body>
<p class="centrado">¡BIENVENIDOS A NUESTRA PAGINA WEB! Pronto estará terminada.kshd dhcd dhc</p>
Un enlace externo de un periodico.El Pais</p>
</body>[contenido no disponible]
[correo eliminado]</p>
</html>
Esto es todo lo que llevo escrito. Iba algo avanzado y me surgieron algunos problemas. 1º: puse un fondo que era como el diseño de la web, con la barra de menu, titulo ... sin que se repitiera. Y en internet no se ve. Entonces solo puese como fondo la parte de arriba del diseño pero tampoco se ve (ocupa 216 Kb) ¿Qué puedo hacer para que se vea?
2º: el logotipo de la web al colocarlo se pone siempre en el medio ¿como se coloca en el lado izquierdo?
3º: en el menu lateral al colocar una imagn de fondo y unos cuantos enlaces (a ningun lado) el texto que estaba escrito fuera del menu, en el contenido se coloca debajo del menu lateral, aunque este está a la izquierda ¿Cómo coloco el texto al lado del menu lateral?
4º: y creo que es el ultimo... :) en el menu principal al poner el colo de las letras solo se colorean 2 palabras y las otras 2 se queda igual ¿cómo se colorean del mismo color todas?
Si tengo algun fallo en los estilos o en las plantillas, me pueden corregir sin preocuparse :)
Muchas gracias!!
PLANTILLA:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Page title</title>
<link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
</head>
<body>
<div id="global">
<div id="cabecera">
<div id="logotipo"></div>
<a href="index.html">
[contenido no disponible]</div><div id="navegacion"><ul>
</div><div id="menu"><ul>
</div><div id="contenido">
<h1>La publicidad. Texto de prueba.</h1>
Este es el primer parrafo de prueba ....... ....... ......... . ........ ........ ..._______ ______ _______ _______ ______ _____ ______ ______ ______ _______ ______ _____ ______ ________ ___________ ________ _____ ___ ________ ________ ______ ________ ____ _____ _____ _____ _____ ____ ___ __ .............. ............... ....................... ...............</p>
Y este es el segundo parrafo de prueba, que lo relleno todo con _ y . porque en verdad no se que poner :P ....... ....... ......... . ........ ........ ..._______ ______ _______ _______ ______ _____ ______ ______ ______ _______ ______ _____ ______ ________ ___________ ________ _____ ___ ________ ________ ______ ________ ____ _____ _____ _____ _____ ____ ___ __ .............. ............... ....................... ...................... ....... ......... . ........ ........ ..._______ ______ _______ _______ ______ _____ ______ ______ ______ _______ ______ _____ ______ ________ ___________ ________ _____ ___ ________ ________ ______ ________ ____ _____ _____ _____ _____ ____ ___ __ .............. ............... ....................... ...............</
</p>
</div>
<div id="pie"><div id="pie">
<div id="pieuno">pie uno</div>
<div id="piedos">pie dos</div>
<div id="pietres">pie tres</div>
<div id= "creditos">Creado por Gonzalo. </div>
</div></div>
</div>
</body>
</html>
ESTILOS GENERALES:
* {margin:0px ; padding:0px ; border: 0px}
body {background-color: #816f61 ; background-image: url(objetos/diseño web fondo.png); background-repeat: no-repeat ; background-position: top}
img {border-style: none}
#cabecera {background-color: none}
#contenido {background-color: none ; color:red ; width: 800px ; float:left }
#pie {background-color: none; color: black; font.size: 0.9em ; height: 65px ;}
#global {width:800px ; margin: 4px auto}
body {text-align: center}
#menu {background-color: none ; color: #cdb5a2 ; width: 199px ; float:right ; text-align:left; margin: 0px 0px 10px 5px ; background-image: url(objetos/menu vertical.png)}
#menu li { list-style:none; color: #cdb5a2 ;margin: 15px 15px 15px 20px }
a {color: brown; font-size:1.3em ; text-decoration: none}
a:link {}
a:visited {}
a:hover {color:none; text-decoration:none; display: block; background-color: none}
a:active {}
p {text-align: justify}
#contenido p {padding: 0px 250px 0px 30px ; text-indent: 20px}
h1 {font-size: 1.2em; color:blue ; font-weight: bold ; text-decoration: none ; text-align: left}
h2 {font.size: 1.1em; color:blue ; font-weight: bold ; text-decoration: none ; text-align: left}
#logotipo {background-color: none ; float:left ; margin-top:0px; padding: 0px 0px 0px 0px }
#publicidad {background-color: pink ; width:400px ; float:right }
#navegacion { font-weight: bold ; background-color: none ; border: none ; height:30px ; float:right ; padding: 0px 100px 0px 0px }
#navegacion li { float:right ; list-style:none ; margin: 0px 10px 0px 10px }
#navegacion li {color: #cdb5a2}
#pieuno {background-color: none ; float:left ; width:150px }
#piedos {background-color: none ; float:left ; width:498px }
#pietres {background-color: none ; float:left ; width:150px }
#creditos {float: right}
ESTILOS:
body {background-color: #816f61 ; background-image: url(objetos/diseño web fondo.png); background-repeat: no-repeat ; background-position: top}
img {border-style: none}
.centrado {text-align:center}
INDEX:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Equidistantes</title>
<link rel="stylesheet" href="estilos.css" type="text/css" media="all">
</head>
<body>
<p class="centrado">¡BIENVENIDOS A NUESTRA PAGINA WEB! Pronto estará terminada.kshd dhcd dhc</p>
Un enlace externo de un periodico.El Pais</p>
</body>[contenido no disponible]
[correo eliminado]</p>
</html>
Esto es todo lo que llevo escrito. Iba algo avanzado y me surgieron algunos problemas. 1º: puse un fondo que era como el diseño de la web, con la barra de menu, titulo ... sin que se repitiera. Y en internet no se ve. Entonces solo puese como fondo la parte de arriba del diseño pero tampoco se ve (ocupa 216 Kb) ¿Qué puedo hacer para que se vea?
2º: el logotipo de la web al colocarlo se pone siempre en el medio ¿como se coloca en el lado izquierdo?
3º: en el menu lateral al colocar una imagn de fondo y unos cuantos enlaces (a ningun lado) el texto que estaba escrito fuera del menu, en el contenido se coloca debajo del menu lateral, aunque este está a la izquierda ¿Cómo coloco el texto al lado del menu lateral?
4º: y creo que es el ultimo... :) en el menu principal al poner el colo de las letras solo se colorean 2 palabras y las otras 2 se queda igual ¿cómo se colorean del mismo color todas?
Si tengo algun fallo en los estilos o en las plantillas, me pueden corregir sin preocuparse :)
Muchas gracias!!