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

HTML - imagen responsive

Volver
Nuevo Tema
<<>>
 
Vista:
sin imagen de perfil

imagen responsive

Publicado por gabriel (1 intervención) el 10/12/2018 15:07:58
Hola. soy algo nuevo en esto. hice una pagina con su correspondiente estilo css, de manera responsive. luego al hacer otra página, lo que no puedo hacer es , que la imagen que pongo nueva me quede de la misma manera, es decir, que no me qeda responsive. cómo puedo solucionar esto. gracias!
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
Imágen de perfil de Xavi
Val: 159
Bronce
Ha mantenido su posición en HTML (en relación al último mes)
Gráfica de HTML

imagen responsive

Publicado por Xavi (57 intervenciones) el 10/12/2018 18:42:39
Hola Gabriel, no entiendo muy bien cual es tu problema, pero si la estructura de las dos paginas es la misma, puedes utilizar el mismo archivo de estilos, no?
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 ScriptShow
Val: 359
Bronce
Ha mantenido su posición en HTML (en relación al último mes)
Gráfica de HTML

imagen responsive

Publicado por ScriptShow (409 intervenciones) el 21/12/2018 16:55:43
Saludos Gabriel,

sin ver el código completo, es difícil dar soluciones. No obstante, hay clases genéricas muy útiles, compatibles, adaptables...

Para una imagen perfetamente centrada y responsive, hice esto:

https://www.lawebdelprogramador.com/foros/HTML/1678140-imagen-responsive.html

Para varias imágenes centradas y responsive, en vertical:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<!DOCTYPE html>
 
<html>
<head>
<meta name="viewport" content="width=device-width">
<style type="text/css">
.img {
position: relatuve;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
max-width: 100%;
max-height: 100%;
}
</style>
</head>
<body>
<h2>I M G #1</h2>

<img class="img" src="imagen-1.jpg">
<h2>I M G #2</h2>

<img class="img" src="imagen-2.jpg">
</body>
</html>

Todo es cuestión de simplificar y adaptar.
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