L
Lubricidad Hernandez
Gamma
¡Buenas! Qué tal compañeros.
Me encuentro haciendo un blog completamente por gusto. Me he interesado en aprender a pasar plantillas diseñadas con Photoshop a HTML, y de éste a Wordpress. Lo cierto es que no tengo mucha idea, es mi primer "diseño" web, y lo que estudio no tiene nada que ver con ordenadores, ni con diseño ni informática, pero me gusta, así que aprendo un poco por mi cuenta a base de ensayo y error. Soy muy curioso e investigo mil veces y leo de todo antes de preguntar, pero esta vez por más vueltas que le dé, como tengo poca o ninguna idea...
Sé que mi problema es sencillo y lo resolveréis en un segundo, ¡pero yo no lo veo! Maldito de mí. La poca idea que tengo es de un blog personal que tengo en Blogger y de mi primer contacto con Wordpress, que fue para traducir una plantilla.
Quiero repetir esta imagen arriba a todo lo ancho del navegador, amoldándose al tamaño de la ventana. Pero que el Header quede completamente fijo en el centro a la anchura de 1000px. Creía saber cómo pero habré hecho un cacao...
Enlace eliminado
Mi HTML es:
Y el CSS el siguiente:
Espero haber copiado suficiente código. Sé que hay cosas que podría hacer más simples, pero no tengo mucha idea, y la estoy haciendo desde cero para aprender, consultando todo lo que encuentro en internet. Uso Dreamweaver CS6, que a veces hace unas cosas más raras...
En resumidas cuentas, lo tengo así por ahora:
Enlace eliminado
Y quiero posicionarlo de este otro modo:
Enlace eliminado
¡Muchísimas gracias por la ayuda! Espero no haberla liado y entender bien los consejos que podáis darme, a ver si poquito a poco puedo lograr algo parecido a lo que he hecho en Photoshop. Sin olvidar que es mi primer diseño, claro.
¡Saludos!
Me encuentro haciendo un blog completamente por gusto. Me he interesado en aprender a pasar plantillas diseñadas con Photoshop a HTML, y de éste a Wordpress. Lo cierto es que no tengo mucha idea, es mi primer "diseño" web, y lo que estudio no tiene nada que ver con ordenadores, ni con diseño ni informática, pero me gusta, así que aprendo un poco por mi cuenta a base de ensayo y error. Soy muy curioso e investigo mil veces y leo de todo antes de preguntar, pero esta vez por más vueltas que le dé, como tengo poca o ninguna idea...
Sé que mi problema es sencillo y lo resolveréis en un segundo, ¡pero yo no lo veo! Maldito de mí. La poca idea que tengo es de un blog personal que tengo en Blogger y de mi primer contacto con Wordpress, que fue para traducir una plantilla.
Quiero repetir esta imagen arriba a todo lo ancho del navegador, amoldándose al tamaño de la ventana. Pero que el Header quede completamente fijo en el centro a la anchura de 1000px. Creía saber cómo pero habré hecho un cacao...
Enlace eliminado
Mi HTML es:
Insertar CODE, HTML o PHP:
</head>
<body>
<div id="wrapper">
<div id="header">
<ul id="menu">
<li><a href="#">Inicio</a></li>
<li><a href="#">Cine</a></li>
<li><a href="#">Música</a></li>
<li><a href="#">Literatura</a></li>
</ul>
<ul id="redes">
<li><a href="#">RSS</a></li>
<li><a href="#">Twitter</a></li>
<li><a href="#">Facebook</a></li>
</ul>
<div id="logo"></div><!-- Fin de logo -->
</div><!-- Fin de header -->
.
.
.
</div><!-- Fin de wrapper -->
</body>
</html>Y el CSS el siguiente:
Insertar CODE, HTML o PHP:
/* Maquetación */
#wrapper {
widht: 1000px;
margin: 0 auto;
}
#header {
width: 100%;
background:url(../img/encabezado-bg.jpg) repeat-x;
height: 194px;
float:left;
}
#logo {
background:url(../img/logo.png) no-repeat;
height: 117px;
margin: 25px 0 0 25px;
display:block;
}
#menu {
float:left;
text-align:center;
font-family:Tahoma, Geneva, sans-serif;
width: 375px;
margin: 54px 0 0 350px;
}
#menu li {
float:left;
display:block;
padding: 10px;
margin-right: 25px;
}
#redes {
float:left;
display:block;
text-align:center;
font-family:Tahoma, Geneva, sans-serif;
width: 227px;
margin: 54px 0 0 30px;
}
#redes li {
float:left;
display:block;
padding: 10px;
margin-right: 5px;
}Espero haber copiado suficiente código. Sé que hay cosas que podría hacer más simples, pero no tengo mucha idea, y la estoy haciendo desde cero para aprender, consultando todo lo que encuentro en internet. Uso Dreamweaver CS6, que a veces hace unas cosas más raras...
En resumidas cuentas, lo tengo así por ahora:
Enlace eliminado
Y quiero posicionarlo de este otro modo:
Enlace eliminado
¡Muchísimas gracias por la ayuda! Espero no haberla liado y entender bien los consejos que podáis darme, a ver si poquito a poco puedo lograr algo parecido a lo que he hecho en Photoshop. Sin olvidar que es mi primer diseño, claro.
¡Saludos!
