Firebug es grande, y me permite ver todo el CSS aplicado a un elemento en el DOM que seleccione, pero tampoco se puede:¿Hay una extensión de navegador para obtener todo el CSS que se aplica a un elemento DOM?
a) ver línea por línea, como se define en la CSS, en el orden aplicado (muy útil pero no lo que estoy buscando) o
b) Verlo "calculado", que son todas las reglas CSS y los valores que tiene este elemento.
Lo que quiero es una herramienta o extensión que me permita seleccionar un elemento y me muestre, en forma de copia de copiado, todo el CSS que se ha definido para ese elemento. Si el elemento tiene estilo de fuente: normal solo porque es el valor predeterminado para ese elemento, no quiero eso allí (Firebug muestra todo esto en la vista computada).
Básicamente quiero ser capaz de:
- veo un elemento que me gustaría replicar en un sitio web (como un botón) exactamente en mi propio sitio web.
- utilizar esta herramienta para conseguir un montón de CSS aplicada a ese elemento.
- Pegar en mi propio CSS.
- Obtenga el mismo elemento que busca en mi sitio web. ¡Hurra!
¿Alguna idea?
Solo que Firefox tiene "todo lo que necesitas" también, mira mi respuesta ... –
Esto parece casi lo que quiero. El único problema es que le muestran _todas_ las reglas de CSS y sus valores, en lugar de solo lo que el elemento le ha aplicado desde todas las definiciones de CSS en la página. Quiero decir, puede tener clip: auto, clip-path: none; etc. incluso si eso no ha sido anulado de su valor predeterminado para este elemento, entonces básicamente el CSS calculado para el elemento que proporciona esta herramienta tiene MUCHO código CSS innecesario. – manuelflara