Foros del Web » Creando para Internet » CSS »

[SOLUCIONADO] Me podrian ayudar con una plantilla simple de css.

Estas en el tema de Me podrian ayudar con una plantilla simple de css. en el foro de CSS en Foros del Web. Hola amigos... Tengo un problema con una plantilla muy simple de css de la cual requiero su ayuda por favor. El código css es... @import ...
  #1 (permalink)  
Antiguo 02/01/2014, 21:37
Avatar de Marthita23  
Fecha de Ingreso: enero-2003
Ubicación: Edo Mexico
Mensajes: 485
Antigüedad: 16 años, 9 meses
Puntos: 17
Pregunta Me podrian ayudar con una plantilla simple de css.

Hola amigos...

Tengo un problema con una plantilla muy simple de css de la cual requiero su ayuda por favor.

El código css es...

Código CSS:
Ver original
  1. /*    Generated by [url]http://www.cssportal.com[/url]    */
  2.  
  3. @import url("reset.css");
  4.  
  5. body {
  6.     font-family: Verdana, Arial, Helvetica, sans-serif;
  7.     font-size: 13px;
  8.     color:#333
  9. }
  10.  
  11. p {
  12.     padding: 10px;
  13. }
  14.  
  15. #wrapper {
  16.     margin: 0 auto;
  17.     width: 1000px;
  18. }
  19.  
  20. #content {
  21.     float: left;
  22.     background: #FFFFFF;
  23.     width: 1000;
  24. }

El cual lo cree con un sitio que hace de forma online las plantillas, anexo a la descarga también viene un código html

Con el siguiente código...

Código HTML:
Ver original
  1. <!DOCTYPE html>
  2. <title>CSS Portal - Layout</title>
  3. <!--[if IE]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
  4. <![endif]-->
  5. <link rel="stylesheet" type="text/css" href="../css/688109.css" />
  6. </head>
  7.     <div id="wrapper">
  8.         <div id="content">
  9.            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet. Duis sagittis ipsum. Praesent mauris. Fusce nec tellus sed augue semper porta. Mauris massa. Vestibulum lacinia arcu eget nulla. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Curabitur sodales ligula in libero. Sed dignissim lacinia nunc. </p><p>Sed lacinia, urna non tincidunt mattis, tortor neque adipiscing diam, a cursus ipsum ante quis turpis. Nulla facilisi. Ut fringilla. Suspendisse potenti. Nunc feugiat mi a tellus consequat imperdiet. Vestibulum sapien. Proin quam. Etiam ultrices. Suspendisse in justo eu magna luctus suscipit. Sed lectus. Integer euismod lacus luctus magna. Quisque cursus, metus vitae pharetra auctor, sem massa mattis sem, at interdum magna augue eget diam. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Morbi lacinia molestie dui. Praesent blandit dolor. </p><p>Sed non quam. In vel mi sit amet augue congue elementum. Morbi in ipsum sit amet pede facilisis laoreet. Donec lacus nunc, viverra nec, blandit vel, egestas et, augue. Vestibulum tincidunt malesuada tellus. Ut ultrices ultrices enim. Curabitur sit amet mauris. Morbi in dui quis est pulvinar ullamcorper. Nulla facilisi. Integer lacinia sollicitudin massa. Cras metus. Sed aliquet risus a tortor. Integer id quam. </p>
  10.        </div>
  11.     </div>
  12. </body>
  13. </html>

El problema que tengo es que quiero cambiar todo ese texto de ejemplo por un titulo, no hay problema en darle las propiedades al texto, el problema que tengo es que no lo puedo centrar a la pagina ni he podido agregar un enlace en el.

La siguiente imagen es de como esta la plantilla ya con el titulo...



Así, como esta en la imagen anterior es lo único que he podido lograr.

Lo que quiero hacer y es en donde solicito de su ayuda es colocar el titulo centrado en cuanto altura y anchura como se ve en la siguiente imagen...



Y bueno aparte de centrar el titulo me gustaria que fuera el enlace para ingresar al sitio ya que esta pagina solo seria una portada.

Por ahora no la tengo publicada ya que esta en mantenimiento el host pero me gustaria que me indicaran como solucionar el problema para en cuanto publique el sitio nuevamente ya cuente con ese cambio.

Les mando un saludo, gracias... FELIZ 2014

Última edición por pzin; 03/01/2014 a las 01:43 Razón: formato código
  #2 (permalink)  
Antiguo 02/01/2014, 22:42
 
Fecha de Ingreso: septiembre-2010
Ubicación: Trujillo
Mensajes: 16
Antigüedad: 9 años, 2 meses
Puntos: 0
Respuesta: Me podrian ayudar con una plantilla simple de css.

Hola,
Imagino que esa imagen esta como fondo (background) entonces si te entendi bien deseas cambiar el parrafo por un titulo con enlace, si es asi bien aqui vamos:

Debes hacer esto en el cuerpo del html:

Código HTML:
Ver original
  1. <div id="content">
  2.     <h1><a href="http://enlaceparaeltitulo.com">El título va aquí</a></h1>
  3. </div>

Y como esta pagina será una portada, necesitamos que ocupe toda la pantalla, ¿cierto?
entonces agregas el siguiente estilo para tu elemento #content

Código CSS:
Ver original
  1. #content {
  2.     position: absolute;
  3.     display: table;
  4.     width: 100%;
  5.     height: 100%;
  6. }

Luego centramos el título en vertical

Código CSS:
Ver original
  1. #content  h1 {
  2.    display: table-cell;
  3.    width: 100%;
  4.    height: 100%;
  5.    text-align: center;
  6.    vertical-align: middle
  7. }

Bueno eso fue todo, es una de las muchas soluciones para centrar texto o elementos verticalmente.
Espero te sirva.

¡ Buena suerte !

Última edición por pzin; 03/01/2014 a las 01:44 Razón: formato código
  #3 (permalink)  
Antiguo 04/01/2014, 12:23
Avatar de Marthita23  
Fecha de Ingreso: enero-2003
Ubicación: Edo Mexico
Mensajes: 485
Antigüedad: 16 años, 9 meses
Puntos: 17
Sonrisa Respuesta: Me podrian ayudar con una plantilla simple de css.

Gracias joseluisq me ayudo mucho la información que me compartiste ya pude solucionar mi problema.

Etiquetas: background, color, html, plantilla, simple
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta

SíEste tema le ha gustado a 1 personas




La zona horaria es GMT -6. Ahora son las 14:05.