¿Cómo animar una línea recta en movimiento lineal usando CSS?

El movimiento lineal de una línea recta significa que la línea comenzará en un punto, irá al segundo punto y luego regresará al punto de partida. Es una especie de movimiento de ida y vuelta. Lo haremos usando solo CSS. Enfoque: el enfoque es crear primero una línea recta y luego animarla usando fotogramas clave. … Continue reading «¿Cómo animar una línea recta en movimiento lineal usando CSS?»

CSS | Propiedad de elementos de alineación

La propiedad align-items se usa para establecer la alineación de los elementos dentro del contenedor flexible o en la ventana dada. Alinea los elementos flexibles a lo largo del eje. La propiedad align-self se usa para anular la propiedad align-items. Sintaxis: align-items: stretch|center|flex-start|flex-end|baseline|initial| inherit; Valor por defecto tramo El valor de la propiedad: estirar: los … Continue reading «CSS | Propiedad de elementos de alineación»

Propiedad CSS scroll-margin-top

La propiedad scroll-margin-top se usa para establecer todos los márgenes de desplazamiento en la parte superior de un elemento a la vez. El valor especificado para scroll-margin-top determina qué parte de la página que está principalmente fuera del soporte debe permanecer visible. Por lo tanto, los valores superiores del margen de desplazamiento representan los inicios … Continue reading «Propiedad CSS scroll-margin-top»

¿Cómo establecer el orden de los elementos flexibles dentro del elemento de división en CSS?

 La propiedad order en CSS se usa para especificar el orden de los elementos flexibles dentro del contenedor. Entonces, para establecer el orden de los elementos flexibles dentro del elemento de división, usamos la propiedad order y establecemos el orden de los elementos en CSS. En este artículo, aprenderemos cómo establecer el orden de los … Continue reading «¿Cómo establecer el orden de los elementos flexibles dentro del elemento de división en CSS?»

Propiedad del cursor CSS

La propiedad del cursor se usa para especificar el cursor del mouse que se mostrará al señalar un elemento . Esta propiedad se define con cero o más valores de <url> separados por comas seguidos de 1 valor de palabra clave como obligatorio y cada <url> apuntará al archivo de imagen. Sintaxis:   cursor: value; Valores … Continue reading «Propiedad del cursor CSS»

CSS | Propiedad grid-gap

La propiedad grid-gap establece el tamaño del espacio entre las filas y las columnas en un diseño de cuadrícula. Es una propiedad abreviada para las siguientes propiedades:   propiedad grid-column-gap propiedad grid-row-gap Sintaxis:   grid-gap: grid-row-gap grid-column-gap; Valores de propiedad:  grid-row-gap : establece el tamaño del espacio entre las filas en un diseño de cuadrícula. Su valor por … Continue reading «CSS | Propiedad grid-gap»

Materializar iconos CSS

Materialise CSS proporciona un amplio conjunto de íconos de materiales de Google que se pueden descargar desde las especificaciones de Material Design . Las bibliotecas de íconos que son compatibles con materialise css son los íconos de materiales de Google, los íconos de Font Awesome y los íconos de Bootstrap . Se pueden seleccionar diferentes … Continue reading «Materializar iconos CSS»

¿Cómo usar variables CSS con TailwindCSS?

Tailwind CSS  permite a los usuarios utilizar clases predefinidas en lugar de utilizar las propiedades CSS puras.  Tenemos que instalar el Tailwind CSS . Cree el archivo CSS principal (Global.css) que se verá como el siguiente código. Global.css: en el siguiente código, todo el cuerpo se envuelve en un solo selector. Todo el cuerpo se … Continue reading «¿Cómo usar variables CSS con TailwindCSS?»

¿Cómo crear una forma usando el recorte de CSS?

Puede crear fácilmente formas usando la propiedad clip-path en CSS. En realidad , la propiedad clip-path le permite recortar un elemento a una forma básica. La forma básica como círculo, elipse, el polígono se puede lograr usando el valor de la propiedad < basic-shape> de clip-path que se discutirá más adelante en este artículo. El … Continue reading «¿Cómo crear una forma usando el recorte de CSS?»

¿Cómo usar SVG con: antes o: después del pseudo elemento?

Los pseudo-elementos :before y :after permiten agregar estilo a la página web sin agregar marcas innecesarias. El contenido SVG se puede agregar utilizando estos pseudoelementos siguiendo los métodos que se describen a continuación: Método 1: usar la propiedad de imagen de fondo: la propiedad de imagen de fondo se usa para establecer una o más … Continue reading «¿Cómo usar SVG con: antes o: después del pseudo elemento?»