Unidad 17. Avanzado: Inspección de CSS

Inspeccionar elementos

En la barra de documento de Dreamweaver encontramos un botón que todavía no hemos visto: el botón Inspeccionar.

Al pulsarlo, se activa la Vista en vivo y el modo de inspección CSS.

Con este modo activo, al pasamos el cursor sobre un elemento, éste se resaltará.

Si observas la imagen anterior, distinguirás tres colores:

• El azul, sirve para resultar el elemento.
• El rosa, indica el padding aplicado al elemento.
• El amarillo, corresponde al margin aplicado al elemento.

Además, la vista Actual del panel Estilos CSS nos irá mostrando las reglas que afectan al elemento. Las resaltadas con un fondo más oscuro, corresponden directamente al elemento.

Así, en la imagen anterior, vemos que el elemento resaltado es un párrafo, con un padding de 5px, aunque le afectan reglas del body y de #content.