CSS Ejemplos

Fondo CSS

Una imagen de fondo fija (esta imagen no se desplaza con el resto de la página)

Explicación de las propiedades de fondo

Texto CSS

 

Explicación de las propiedades de texto

Fuentes CSS

 

Explicación de las propiedades de fuente

Enlaces CSS

Agregar diferentes colores para enlaces visitados/no visitados

 

Explicación de las propiedades de enlace

Listas CSS

Establecer una imagen como marcador de lista con una solución compatible con varios navegadores

CSS: eliminar los estilos predeterminados de los elementos de lista li

 

Explicación de las propiedades de lista

Tablas CSS

Establecer la alineación horizontal del contenido (alineación de texto)

Establecer la alineación vertical del contenido (alineación vertical)

 

Explicación de las propiedades de tabla

Modelo de caja CSS

Especificar un ancho total de 250 píxeles con una solución compatible con varios navegadores

 

Explicación del modelo de caja

Bordes CSS

 

 

 

 

Todas las propiedades del borde superior en una sola declaración

Todas las propiedades del borde inferior en una sola declaración

Todas las propiedades del borde izquierdo en una sola declaración

Todas las propiedades del borde derecho en una sola declaración

 

Explicación de las propiedades de borde

Contorno CSS

 

Explicación de las propiedades de contorno

Márgenes CSS

Establecer el margen superior del texto usando valores en centímetros

Establecer el margen inferior del texto usando valores porcentuales

Establecer el margen izquierdo del texto usando valores en centímetros

 

Explicación de la propiedad Margin

Relleno CSS

 

Explicación de la propiedad padding

Agrupación y anidamiento CSS

 

Explicación de agrupación y anidamiento

Dimensiones CSS

Establecer el ancho máximo de un elemento usando valores en píxeles

Establecer el ancho mínimo de un elemento usando valores en píxeles

 

Explicación de las propiedades de dimensión

Visualización CSS

 

Explicación de la propiedad Display

Posicionamiento CSS

Cómo usar barras de desplazamiento para mostrar el contenido desbordado dentro de un elemento

Cómo configurar el manejo automático de desbordamiento del navegador

Establecer la parte superior de una imagen usando valores en píxeles

Establecer la parte inferior de una imagen usando valores en píxeles

Establecer la parte izquierda de una imagen usando valores en píxeles

Establecer la parte derecha de una imagen usando valores en píxeles

 

Explicación de las propiedades de posicionamiento

Flotación CSS

Agregar borde y margen a una imagen y flotarla a la izquierda del párrafo

 

Explicación de la propiedad Float

Alineación de elementos CSS

Establecer alineación izquierda/derecha con una solución compatible con varios navegadores

Utilice soluciones multinavegador, establezca la alineación de posición izquierda/derecha, flotante

 

Explicación de las propiedades de alineación

Contenido generado CSS

Inserte la URL entre paréntesis después de cada enlace usando la propiedad content

La numeración de secciones y subsecciones es "Sección 1", "1.1", "1.2", etc.

Pseudoclases CSS

:first-child - coincide con el primer elemento i dentro de un elemento p

:first-child - coincide con todos los elementos I del primer elemento p

 

Explicación de las pseudo-clases

Pseudoelementos CSS

Establecer la primera letra del texto como una letra especial

 

Explicación de los pseudo-elementos

Barra de navegación CSS

 

Explicación de la barra de navegación

Galería de imágenes CSS

 

Explicación de la galería de imágenes

Opacidad de imágenes CSS

 

Explicación de la opacidad de las imágenes

Sprites de imágenes CSS

 

Explicación de los sprites de imágenes

Selectores de atributos CSS

Seleccionar elementos cuyo atributo title sea igual a un valor específico

Seleccionar elementos cuyo atributo title sea igual a un valor específico (usando (~) para separar atributo y valor)

Seleccionar elementos cuyo atributo title sea igual a un valor específico (usando (|) para separar atributo y valor)

 

Explicación de los selectores de atributos


Ejemplos de aplicación CSS

Más ejemplos:https://www.jyshare.com/examples/

Otras extensiones