К содержанию

Tutorial de HTML y CSS para principiantes

Tutorial simple de maquetación con lenguajes HTML y CSS para principiantes con teoría detallada y libro de problemas.

Fundamentos de CSS

Fundamentos del lenguaje CSS

Cómo trabajar con CSS

Palabras clave para color en CSS

Cualquier color en CSS

Ancho y alto de elementos en CSS

Alineación de texto en CSS

Alineación de texto a la derecha en CSS

Alineación de texto al centro en CSS

Alineación de texto a la izquierda en CSS

Alineación de texto simultánea a la derecha e izquierda en CSS

Práctica de alineación de texto en CSS

Grosor del texto en CSS

Cursiva en CSS

Tamaño de fuente en CSS

Tipo de fuente en CSS

Interlineado en CSS

El valor de line-height sin unidades en CSS

Propiedad abreviada font en CSS

Sangría en CSS

Efectos de texto en CSS

Subrayado de texto en CSS

Subrayado superior de texto en CSS

Tachado de texto en CSS

Cancelación de efectos para texto en CSS

Práctica sobre propiedades básicas de CSS

Selectores

Relaciones de parentesco de etiquetas en HTML

Herencia de propiedades CSS

Agrupación de selectores en CSS

Propiedades comunes al agrupar selectores en CSS

Selector de descendientes en CSS

Selector hijo en CSS

Clases de elementos en CSS

Etiqueta span para fragmentos de texto en HTML

Etiqueta div para agrupar etiquetas en HTML

Agrupación de clases en CSS

Etiqueta con clase asignada en CSS

Selector de descendientes y clases en CSS

Combinaciones complejas de selectores descendentes y clases en CSS

Error de principiantes en el selector de descendientes

Elemento con múltiples clases CSS

Selección de elementos por id único en CSS

Selector por id y clases CSS

Uso de id en CSS

Selección de elementos por múltiples clases en CSS

Varios selectores consecutivos en CSS

Error al usar múltiples selectores CSS

Agrupación de selectores complejos en CSS

Error al agrupar selectores CSS complejos

Práctica con combinaciones de selectores CSS

Especificidad de selectores CSS

Observación sobre el conflicto de propiedades CSS

Reglas de especificidad en CSS

Prioridad de selectores descendentes en CSS

Selector adyacente en CSS

Selector hermano en CSS

Selector universal en CSS

Selectores de atributos en CSS

Estados de los enlaces en CSS

Matices del orden de los estados de los enlaces en CSS

Estados de enlaces link y visited en CSS

Uso común de los estados de los enlaces en CSS

Selectores complejos con estados de enlaces en CSS

Enlace con clase en CSS

Selección de elementos extremos en CSS

Selección por posición de elementos en CSS

Selección del único hijo en CSS

Selección de elementos vacíos en CSS

Selección por posición y tipo de elementos en CSS

Selector de negación en CSS

Decoración

Establecer el color de fondo en CSS

Fundamentos de los bordes en CSS

Borde continuo en CSS

Borde de puntos en CSS

Borde de guiones en CSS

Borde convexo en CSS

Doble borde en CSS

Propiedad abreviada para el borde en CSS

Bordes para lados individuales en CSS

Redondeo de bordes de bloque en CSS

Bordes redondeados de fondo en CSS

Crear un círculo en CSS

Diferentes redondeos para diferentes esquinas en CSS

Cuatro valores de border-radius para diferentes esquinas en CSS

Dos valores de redondeo para diferentes esquinas en CSS

Tres valores de redondeo para diferentes esquinas en CSS

Esquinas redondeadas en porcentaje en CSS

Crear un círculo usando border-radius en porcentaje en CSS

Imagen de fondo en CSS

Repetición de la imagen de fondo en CSS

Otras propiedades para fondos en CSS

Trabajo con marcadores de listas ul en CSS

Marcadores cuadrados para listas ul en CSS

Marcadores de lista ul en forma de círculos en CSS

Trabajo con marcadores de listas ul en CSS

Eliminación de los marcadores de listas ul en CSS

Trabajo con marcadores de listas ol en CSS

Números romanos minúsculas para listas ol en CSS

Números romanos mayúsculas para listas ol en CSS

Letras latinas minúsculas para listas ol en CSS

Letras latinas mayúsculas para listas ol en CSS

Letras griegas minúsculas para listas ol en CSS

Números con cero inicial para listas ol en CSS

Modelo de Caja

Trabajo con márgenes margin en CSS

Márgenes margin para diferentes lados en CSS

Múltiples valores en la propiedad margin en CSS

Los cuatro valores de la propiedad margin en CSS

Dos valores en la propiedad margin en CSS

Tres valores en la propiedad margin en CSS

Trabajo con relleno padding en CSS

Relleno padding para diferentes lados en CSS

Múltiples valores en la propiedad padding en CSS

Trabajo con relleno padding en CSS

Influencia del borde en la expansión de elementos en CSS

Influencia del padding y el borde en la expansión de elementos en CSS

Cancelar la expansión de elementos en CSS

Características de los elementos de bloque en CSS

Ancho y alto de un elemento de bloque en CSS

Ancho de un elemento de bloque en CSS

Altura de un elemento de bloque en CSS

Altura de un elemento de bloque sin contenido en CSS

Varios elementos de bloque adyacentes en CSS

Características de los elementos en línea en CSS

Ancho y alto de un elemento en línea en CSS

Varios elementos en línea uno al lado del otro en CSS

Sangrías entre elementos en línea en CSS

Definición del modelo de caja de etiquetas HTML

Trabajo con la propiedad display en CSS

Características de los elementos en línea-bloque en CSS

Ancho y alto de un elemento en línea-bloque en CSS

Ancho de un elemento en línea-bloque en CSS

Altura del elemento en línea-bloque en CSS

Varios elementos en línea-bloque uno al lado del otro en CSS

Alineación de elementos de bloque en CSS

Alineación de un elemento de bloque con margen izquierdo en CSS

Alineación de elemento de bloque con margen derecho en CSS

Alineación de elementos en línea en CSS

Centrado de elementos en línea en CSS

Centrado de múltiples elementos en línea

Alineación de elementos en línea a la derecha en CSS

Alineación de elementos en línea-bloque en CSS

Centrado de elementos en línea-bloque en CSS

Alineación de elementos en línea-bloque a la derecha en CSS

Elementos flex en CSS

Altura del elemento padre de elementos flex en CSS

Ancho del contenedor flex en CSS

Contenedor padre en línea-bloque de elementos flex en CSS

Relleno (padding) del contenedor de elementos flex en CSS

Márgenes margin para elementos hijos en CSS

Alineación de elementos flex en CSS

Alineación de elementos flex al centro en CSS

Alineación de elementos flex en el contenedor en CSS

Alineación de elementos flex con márgenes en el contenedor

Alineación de elementos flex en el contenedor con márgenes iguales

Posicionamiento

Posicionamiento absoluto de elementos en CSS

Posicionamiento relativo de elementos en CSS

Posicionamiento relativo al padre en CSS

Posicionamiento relativo a un padre absoluto en CSS

Posicionamiento absoluto sin coordenadas en CSS

Centrado a través de absoluto en CSS

Valores negativos en el posicionamiento CSS

Posicionamiento fijo en CSS

Bloque de ancho completo en CSS

Superposición de elementos en el eje Z en CSS

Regulación de la superposición de elementos en el eje Z en CSS

Matices de la aplicación del valor negativo de z-index en CSS

Flotantes

Introducción a la propiedad float en CSS

Penetración de elementos flotantes a través de etiquetas en CSS

Combinación de float y margin en CSS

Combinación de float y padding en CSS

Elementos flotantes bajo etiquetas en CSS

Comportamiento de los floats en el elemento padre en CSS

Altura del padre de floats en CSS

Texto en el padre de flotantes en CSS

Flujo en CSS

Cancelación del flujo con la propiedad clear en CSS

Div separado con clearfix en CSS

Clearfix y la altura del padre en CSS

Propiedad float para bloques en CSS

Propiedad float y múltiples bloques en CSS

Propiedad float y padre sin texto en CSS

Flexbox

Colocación de elementos flex en fila o columna en CSS

Colocación de elementos flex en una fila invertida en CSS

Colocar elementos flex en columna en CSS

Voltear una columna con elementos flex en CSS

Eje principal y eje transversal en contenedores flexibles en CSS

Alineación de elementos flex a lo largo del eje principal en CSS

Alineación de bloques flex a lo largo del eje transversal en CSS

Significado del valor center para la propiedad align-items en CSS

Centrado sin altura de bloques en CSS

Centrado de bloques con diferente altura en CSS

Significado del valor stretch de la propiedad align-items en CSS

Práctica de alineación en ejes en CSS

Alineación de elementos individuales en el modelo flex en CSS

Orden de bloques flex en CSS

Cuadrículas

Introducción a CSS Grid

Pistas y líneas en CSS Grid

Visualización de grids en el depurador del navegador

Número y ancho de columnas en CSS Grid

Unidad fr en CSS Grid

Unidades fraccionarias fr en Grids CSS

Píxeles y unidades fr en CSS Grid

Porcentajes y unidades fr en CSS Grid

Función repeat en CSS Grid

Significado de auto en CSS Grid

Significado de auto-fill en CSS Grid

Función minmax en CSS Grid

Significado de auto-fit en CSS Grid

Cantidad y ancho de filas en cuadrículas CSS

Abreviatura para filas y columnas en CSS Grid

Combinación de filas en CSS Grid

Combinación de columnas en cuadrículas CSS

Combinaciones de uniones por filas y columnas en CSS Grid

Superposición de columnas en CSS Grid

Distancia entre columnas en CSS Grid

Distancia entre filas en CSS Grid

Espaciado entre columnas y filas en CSS Grid

Mosaico en Grid en CSS

Maquetas

Creación de menús en CSS

Diseños de sitios web de una sola columna simples en CSS

Esquema de diseños con múltiples wrappers en CSS

Bloques estructurales de un sitio web en HTML

Esquema de diseño de dos columnas para un sitio web en CSS

Esquema de diseño de tres columnas para un sitio web en CSS

Etiquetas especiales para elementos de diseño de sitios web en HTML

Etiquetas principales de diseño en HTML

Etiqueta para secciones en HTML

Práctica con maquetas en HTML y CSS