Browser developer tools
A suite of browser-integrated utilities for inspecting, debugging, testing, profiling, and analyzing web pages, applications, and browser-executed code.
WordPress Power Toolkit: Harness AI to build next-level websites
A browser inspector is a browser-integrated developer tool for examining and modifying a web page's HTML, CSS, layout, and runtime presentation.
- How it is used
- Uses an interactive browser interface to inspect, test, and debug the visual CSS of web pages.
- How deep it goes
- Explains HTML and CSS panes, selectors, overridden declarations, and live edits, while deferring deeper page-wide CSS classes.
- Examples
- Uses a selected div, crossed-out box-sizing declaration, and a heading CSS rule to illustrate inspection and override behavior.
- What you can do after
- Diagnose/debug with it by locating applied or overridden CSS and testing visual changes instantly.
CSS in Depth, Second Edition
Browser developer tools are built-in utilities for inspecting and debugging a webpage's structure, styles, and runtime behavior.
- How it is used
- Diagnoses CSS results by exposing applied, overridden, and inherited declarations for individual elements.
- How deep it goes
- Shows rule ordering, inheritance, overrides, source locations, filtering, and interactive clip-path editing.
- Examples
- Uses inherited fonts, crossed-out declarations, filtered properties, and draggable clip-path vertices as inspection examples.
- What you can do after
- Diagnose/debug with browser DevTools by locating the rule, inheritance path, or clip-path value behind a rendered result.
Read how CSS in Depth, Second Edition explains browser developer tools →
Related concepts
- browserpart of · A web browser is software that retrieves, interprets, and renders web resources, executes supported web content, and enables interaction with web pages and applications.
- HTMLuses · HTML (HyperText Markup Language) is the standard markup language for structuring content and elements in web documents.
- local storageuses · Local storage is a browser-provided, origin-scoped key-value storage mechanism that persistently stores string values across sessions.
These guides are generated from the text of Manning books by Manning's knowledge graph and link to the sections they draw on. The full books are available on liveBook and at manning.com.