Preprocesadores CSS: Less y Sass
02/11/2019
Herramientas útiles y referencias CSS
02/11/2019
Tabla de contenidos
- Estilos, elementos y código para la composición de tu web
- 1. Media queries para diseño web responsive
- 2. Lista convertida en menú horizontal
- 3. Contenedor con Parallax
- 4. Botón fijo en la parte inferior derecha
- 5. Formulario básico
- 6. Centrado vertical y horizontal de un contenedor
- 7. Contenedores mediante porcentajes
- 8. Contenedores mediante cajas flexibles
- 9. Regla !important
- 10. Ejemplo float/ inline-block /inline
- 11. Alinear imágenes con texto o botones
- 12. Contenedor fijo + contenedor variable o con porcentaje CSS
Estilos, elementos y código para la composición de tu web
1. Media queries para diseño web responsive
0
Ver código de botonera horizontal
3. Contenedor con Parallax
0
4. Botón fijo en la parte inferior derecha
0
5. Formulario básico
Acceder al código de formulario básico
6. Centrado vertical y horizontal de un contenedor
Ejemplo comparativo con flexbox y con la propiedad transform.
0
7. Contenedores mediante porcentajes
0
8. Contenedores mediante cajas flexibles
0
9. Regla !important
La palabra clave !important se utiliza para dar mayor prioridad al valor de una propiedad de forma que si se define la misma propiedad para un elemento no se pueda sobrescribir.
.a { background-color: red!important; }
.a { background-color: blue; } /* los elementos con clase "a" tendrán el fondo de color rojo */
10. Ejemplo float/ inline-block /inline
11. Alinear imágenes con texto o botones
12. Contenedor fijo + contenedor variable o con porcentaje CSS
Realización de cálculos con calc() de CSS para conseguir un contenedor fijo y otro variable.