Posicionamiento flotante de cajas. float: left | right | both; y propiedad clear
Apuntes de alumno y ejemplos de como usar la propiedad float y clear. Esta publicación forma parte del "tutorial css - apuntes de clase"...
¿Te gustaría dominar tus páginas web para que se vean como realmente quieres?
Deja de dar vueltas por internet buscando parches y aprende las bases del diseño web con este tutorial CSS.
Los apuntes, resúmenes de clase, chuletas y ejercicios que encontrarás están pensados para los alumnos del curso IFCD0110 de confección y publicación de páginas web. Pero te sirven aunque no lo curses.
Antes de leer este tutorial es conveniente que estés familiarizado con el html.
El temario es súper extenso. Nunca terminas de aprender CSS del todo.
He dividido el tutorial en diversas secciones.
Verás que hay algunos contenidos todavía no terminados y que voy completando el tutorial sin prisa pero sin pausa.
Por este motivo al final de todo verás también una sección de últimos contenidos publicados.
La siguiente colección de ejercicios y prácticas está ordenada siguiendo el orden de conceptos de este tutorial.
Atención: Los ejercicios que están en texto negro todavía no están publicados.
Apuntes de alumno y ejemplos de como usar la propiedad float y clear. Esta publicación forma parte del "tutorial css - apuntes de clase"...
Ejemplo explicado sobre como centrar verticalmente y horizontalmente una caja dentro de otra mediante position relative y absolute....
Ejemplos prácticos y visuales dónde se muestran los posicionamientos static | absolute | relative | fixed | sticky. Incluye código CSS y HTML...
Hay ocasiones en las que necesitamos centrar un texto pero no hay manera. La forma correcta de hacerlo es mediante CSS....
Ejemplo de como centrar horizontalmente una caja o contenedor en una página web y mediante CSS....
Hemos aprendido como se define el margen, el borde, el relleno y el ancho y la altura. Nos queda pendiente ver como se relacionan estas cajas html entre ellas. Si se apilan. Si se ponen una al lado de la otra. O si se superponen....
¿Se rompen las columnas de tu web al redimensionar el ancho de tu navegador? En esta publicación hablamos de box-sizing con un ejemplo real....
Las dimensiones reales de una caja, por defecto, no son las que indica el width. Veamos como se calculan y en que nos puede ayudar aprenderlo....
El modelo de cajas nos permite definir mediante CSS las propiedades físicas de espacio a una etiqueta html que esté dentro del body. En esta publicación se habla del ancho, altura, relleno, borde y fondo de una caja....