← Todas las herramientas de texto

Calculadora de especificidad CSS

Descubre qué selector CSS gana, con la puntuación de cada selector (ID, clases, elementos).

  • Gratis
  • Sin registro
  • Funciona en cualquier dispositivo

Acerca de Calculadora de especificidad CSS

Pega selectores CSS y mira la especificidad de cada uno como tres números: IDs, luego clases, atributos y pseudoclases, y luego elementos. Gana la puntuación más alta sin importar el orden en el código, y las puntuaciones iguales las gana la regla posterior. Los estilos en línea superan a todos los selectores, y !important los supera a ellos.

Cómo usar Calculadora de especificidad CSS

  1. Escribe o pega uno o más selectores CSS, uno por línea.
  2. Lee la puntuación de cada uno, mostrada como ID, clases y elementos.
  3. Compara las puntuaciones para ver qué regla gana.

¿Por qué usar esta herramienta?

También conocida como

Preguntas frecuentes

¿Cuál es la especificidad de un selector de clase?

Una sola clase cuenta como 0,1,0. Un ID es 1,0,0 y un elemento simple como div es 0,0,1. Compáralos de izquierda a derecha, no como un único número decimal.

¿Qué pasa cuando dos selectores tienen la misma especificidad?

Gana la regla que aparece más tarde en la hoja de estilos. Así que el orden solo importa cuando las puntuaciones son iguales.

¿important anula la especificidad?

Sí, una declaración marcada como important gana a las normales sea cual sea la especificidad. Úsalo con moderación, porque dificulta las anulaciones posteriores.

¿Es gratis Calculadora de especificidad CSS?

Sí. Calculadora de especificidad CSS de Toolipedia es de uso gratuito, sin registro y sin marca de agua.

¿Es seguro usarlo?

Sí. Todo se calcula en tu navegador y nada de lo que introduces se envía a nuestro servidor.

¿Funciona en mi teléfono?

Sí. Funciona en cualquier navegador moderno en Android y iPhone, y también en tabletas y computadoras. No hay que instalar nada.

¿Necesito una cuenta?

No. Solo abre la página y usa la herramienta. No hace falta registrarse ni dar un correo electrónico.

¿Puedo poner Calculadora de especificidad CSS en mi propio sitio web?

Sí. Usa el botón «Insertar en tu sitio» debajo de la herramienta para copiar un fragmento corto de código y pegarlo en tu página. Es gratis, no necesita cuenta y la herramienta sigue funcionando dentro de tu página.

Herramientas relacionadas