Oxygenados La comunidad hispana
Menu
post oxygen builder

Usando Estados

Usando Estados
21 de julio de 2021
Oxigenados Tip del dia

Un estado(State), técnicamente conocido como pseudoclase, permite aplicar estilos a los elementos en función del estado del elemento.

Ejemplos de estados y pseudoclases:

  • un botón con el cursor encima.
  • un campo de formulario activo.
  • el primer o último elemento de un determinado tipo presente en una sección.

EDITANDO ESTILOS PARA LOS ESTADOS DE LOS ELEMENTOS

Primero, haz clic en el botón state. A continuación, selecciona en la lista el estado que deseas editar.

img-5

Ahora puedes editar los estilos para este estado.

AÑADIENDO ESTADOS PERSONALIZADOS

Por defecto,  Oxygen permite editar los estilos :hover, :before y :after.
También es posible añadir estados personalizados.

  1. Click state
  2. Click add state. Se muestra una ventana emergente.
  3. Escribe el nombre del estado/pseudoclase (con o sin el :), y haz clic en OK. El estado se añade ahora a la lista.

img-6

Para añadir un estado compuesto como :hover:before o :first-child:hover, simplemente escribe el estado compuesto en la caja.

LISTA COMPLETA DE ESTADOS / PSEUDOCLASES

Hay muchas pseudoclases disponibles. Los detalles se pueden encontrar en el artículo Mozilla Developer Network: Pseudo-classes 

Última modificación: 20 de junio de 2020

 

VOLVER AL LISTADO COMPLETO