Herramientas para desarrolladores de Chrome: ¿Cómo saber qué anula una regla CSS?

196

Bueno, esto es bastante sencillo. Si las Herramientas para desarrolladores de Chrome me muestran que se anula un estilo, ¿cómo ver qué regla CSS lo anula?

Quiero saber si hay algo como "Muéstrame qué anula esto" .

OBS: Por favor, no me señales a Firebug.

— Ramon K.
fuente

Las Herramientas para desarrolladores de Chrome también le muestran la regla primordial

— Zoltan Toth el

Respuestas:

283

Use el panel Estilo calculado del inspector de elementos. Expanda la propiedad de interés para ver la lista de reglas aplicables y cuál ganó.

Captura de pantalla de Chrome

— josh3736
fuente

Para mí, la pestaña calculada estaba abierta por defecto y, por lo tanto, no figuraba como una pestaña, debería haber tenido un encabezado 'Calculada', de lo contrario, podría estar buscando mucho tiempo.

— MrFox

La técnica ha cambiado un poco a medida que Chrome ha avanzado. En lugar de 'Expandir la propiedad de interés', haga clic en el cristal espía al lado de la propiedad y mostrará qué estilo ganó en la pestaña Estilos.

— intotecho

@intotecho: Chrome 47 ha restaurado el expando en la pestaña Computado desde que el cambio de lupa apestaba. crbug.com/496263

— josh3736

¿Qué pasa si TODOS ellos son cancelados? Probablemente debido a un guión? ¿Cómo saber quién lo hizo?

— darkgaze

Todavía está allí como la pestaña "Computado" en el panel Elementos.

— josh3736

Simplemente puede mirar los que tienen el mismo nombre que no están tachados, recuerde que el listado es importante.

O puede ver los estilos calculados. Serán los estilos realmente aplicados.

— user1902091
fuente

crtrl + shift + c e inspeccionar el elemento. Luego encuentre el estilo sin una línea que lo atraviese, en el cuadro en la esquina inferior derecha.

la anulación está en la mayoría de los casos en la parte superior (y sin una línea que la atraviese, ya que este estilo es el "ganador").

— Peter Rasmussen
fuente

No es el caso cuando un estilo se marca como! Importante

— JCorriveau