HTML - Organizar HTML

 
Vista:
sin imagen de perfil

Organizar HTML

Publicado por Eduardo (2 intervenciones) el 15/07/2023 03:28:42
Hola a todos,
Estoy aprendiendo HTML y no he encontrado una manera de organizar una página de modo que, dentro del body, pueda poner una columna del lado izquierdo, una principal en el centro y otra angosta a la derecha. Esta del centro tendría varias divisiones pero deben ser ir una bajo de otra sin pasar debajo de la izquierda. Una manera que creo funciona es especificando porcentajes, el problema es que creo que esto lo aplica del mismo modo para cuando se consulta en celular y por esto no quisiera usarla. He leído también del Bootstrap, pero por ahora quisiera solo usar HTML y CSS. Lo explico de otra manera, necesito crear una página con 3 columnas principales de determinado ancho cada una. Cada una tendría varios div para organizar los objetos y nunca debe mezclarse el contenido de una columna con la otra. La página se ve principalmente en una laptop, pero quisiera que se pueda ver también en celulares.
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 Ivan

Organizar HTML

Publicado por Ivan (56 intervenciones) el 21/07/2023 17:40:59
Hola,

un diseño que se adapte a los diferentes tamaños de pantalla del dispotivo (pc, tablet, telf) se llama Responsive.
Consiste en que si en un pc con pantalla ancha puedes mostrar 3 columnas (una al lado de la otra), en un telf el diseño cambiaría a mostrar las 3 columnas (una encima de la otra).

Existen varias formas de hacerlo con CSS:
- Con float
- Con flexbox
- Con grid

Cada uno tiene sus pros y sus contras. Te dejo algunos enlaces para que los veas y pongas en práctica:

https://developer.mozilla.org/es/docs/Learn/CSS/CSS_layout/Responsive_Design
https://www.w3schools.com/howto/howto_css_two_columns.asp
https://www.w3schools.com/css/css3_flexbox.asp
https://www.w3schools.com/css/css_grid.asp

Un saludo!
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar
sin imagen de perfil

Organizar HTML

Publicado por Eduardo (2 intervenciones) el 22/07/2023 04:10:03
Hola Ivan,

Creo que el flexbox es la buena opción para esto.

Gracias,
Eduardo
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar