Iniciar sesiónCerrar
Correo:
Contraseña:
Entrar
Recordar sesión en este navegador
Iniciar sesiónIniciar sesiónCrear cuentaCrear cuenta
LWP » Foros » HTML » TEXTO RESPONSIVE

HTML - TEXTO RESPONSIVE

Volver
Nuevo Tema
<<>>
 
Vista:
Imágen de perfil de Carlos Felipe
Val: 7
Ha disminuido su posición en 13 puestos en HTML (en relación al último mes)
Gráfica de HTML

TEXTO RESPONSIVE

Publicado por Carlos Felipe (4 intervenciones) el 21/06/2019 00:39:39
Hola muy buenas tardes. Quiero saber como hago en html. Css. Para poner un texto que en el sitio web se utilizara
como un titulo que no deberá moverse y que dice CONSTRUCCIÓN DESDE CIMIENTOS. (POR EJEMPLO).(VER IMAGEN)
CONSTRUCCION_FORO
¿Cual es el problema?
- No he podido programar el que ese título (construcción desde cimientos) este estático, es decir sin moverse.
- ¿Cual es el código exacto para yo poner un título o títulos y que este no se mueva(n)?

Ayuda. Si miras la imagen 2 (por favor). Tiene un fondo negro con un título que no se mueve. Eso es lo que necesitaría. Muchas gracias

imagen1
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
sin imagen de perfil
Val: 2
Ha aumentado su posición en 34 puestos en HTML (en relación al último mes)
Gráfica de HTML

TEXTO RESPONSIVE

Publicado por Jorge (1 intervención) el 21/06/2019 01:07:25
Vale segun entiendo quieres que la parte negra(navbar) y la parte amarilla(footer) de tu sitio sean estaticos.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<body>
<div class="wrapper">
 <nav class="navbar">
 
</nav>
<div class="content">
   Contenido escroleable
</div>
 
<div class="footer">
   Costruccion desde cimientos
 
</div>
</div>
</body>


y en tu css:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
.wrapper{
position:relative;
width:100%;
height:100%;
  display:grid;
grid-template-rows:10% auto 10%;
grid-template-areas:'navbar' 'content' 'footer';
}
.navbar{
 grid-area:navbar;
}
 
.content{
 grid-area:content;
overflow-y:scroll;
}
 
.footer{
grid-area:footer;
}

Esto haria que tengas un footer y navbar con altura del 10% y el 100% de ancho y ademas un content que tiene 80% de alto y 100% de ancho,que se puede scrollear. Tanto el footer como el navbar seran estaticos.
No se si es lo que necesitabas.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Carlos Felipe
Val: 7
Ha disminuido su posición en 13 puestos en HTML (en relación al último mes)
Gráfica de HTML

TEXTO RESPONSIVE

Publicado por Carlos Felipe (4 intervenciones) el 21/06/2019 20:24:30
Hola muchas gracias. Voy a probar ese código. Esta muy bien elaborado.
Gracias De nuevo
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Carlos Felipe
Val: 7
Ha disminuido su posición en 13 puestos en HTML (en relación al último mes)
Gráfica de HTML

TEXTO RESPONSIVE

Publicado por Carlos Felipe (4 intervenciones) el 21/06/2019 21:01:54
Tu respuesta ha sido genial. Pero no he podido dar solución.
Como ya tengo código css, no me integra con la forma en la que me enviaste tu código. Lo que necesito es adaptar una porción de código a mi código que me permita dejar texto estático. En cualquier parte de la página. Agradecería respuesta. Gracias.
Amigo... tienes WhatsApp? Me gustaría poderte explicar esto con un audio. Gracias.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Carlos Felipe
Val: 7
Ha disminuido su posición en 13 puestos en HTML (en relación al último mes)
Gráfica de HTML

TEXTO RESPONSIVE

Publicado por Carlos Felipe (4 intervenciones) el 22/06/2019 00:00:33
Esto debería dar solución al problema.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
.contenedor
{
width: 100%;
max-width: 1000px;
margin: auto;
padding: 60px;
background: #fff;

margin-top: -560px;
}
 
.titulo{
text-align: center;
font-size: 40px;
margin-bottom: 40px;
font-weight: 100;
}
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar