Códigos Fuente de CSS

Ejemplo del uso de las propiedades justify-content y align-items utilizando el display:flex



https://developer.mozilla.org/es/docs/Web/CSS/CSS_Flexible_Box_Layout/Usando_las_cajas_flexibles_CSS

Código que muestra como al pasar el ratón por encima de un texto, te muestra una capa con el contenido que desees al lado del ratón. Al quitar el ratón de encima de el texto, desaparece la capa que se esta mostrando.

Versión 1:
Probado con IE6,7,8, 9, Firefox, Opera, Chrome y Safari.

Versión 2:
Funciona con todos los navegadores excepto con IE

Este código muestra como crear un gráfico de barras tanto horizontal como vertical utilizando unicamente HTML y CSS.

Este simple código, muestra como recortar un texto y poner puntos suspensivos si el texto no cabe en su contenedor.

Ejemplo que muestra todos los tipos de bordes posibles en CSS

Código que muestra como alinear el primer div a la altura del segundo.

Este simple código, posiciona una imagen en la parte inferior derecha de la pantalla por debajo del contenido de nuestra web.
Al pasar por encima de la imagen con el ratón, se quita la transparencia.

Este código muestra como utilizar variables en CSS y cambiar dichas variables desde JavaScript para cambiar completamente el diseño de nuestra web.
En este ejemplo, se muestra como cambiar los colores y el estilo de un borde cambiando el valor de las variables CSS mediante JavaScript.

En este ejemplo se numeran varias listas encadenadas, pero se puede utilizar con cualquier tipo de elemento de tu web.



https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Lists_and_Counters/Using_CSS_counters

counter-reset: Inicializa el contador y define el nombre del contador. Por defecto empieza en 0

counter-increment: incrementa o decrementa el contador

counter: muestra el contador

PoPup Simple by 2K code

Popup / Modal por focus en puro CSS. No utiliza JavaScript.

Mejor con 2K max.