Pixel Inspector - A Chrome Add-on for Element Inspection
Pixel Inspector is a helpful tool for developers and designers to inspect webpage elements. With this add-on, users can measure element distances and view partial style information.
The main features of Pixel Inspector include:
- Information display: After activating the add-on, users can hover their mouse over an element to view partial style information.
- Element selection: There are two modes for selecting elements - keyboard mode and mouse click mode. Users can switch between the two modes by using the shortcut keys 'ctrl + m' or 'command + m'. In keyboard mode, users can select an element by moving their mouse over it and pressing 'ctrl' or 'command'. In click mode, users can simply click on an element to select it.
- Deselecting elements: In keyboard mode, there are three ways to deselect an element - press 'ctrl' or 'command' twice, press 'ctrl' or 'command' once on the selected element, or press 'esc'. In click mode, users can deselect an element by either clicking on it again or pressing 'esc'.
- Element distance measurement: After selecting an element, users can move their mouse to other elements to display the distance between them.
- Distance display: During the distance measurement process, users can choose to display only the distance in the x or y direction for easier viewing. Pressing 'x' will display only the x direction distance, pressing 'y' will display only the y direction distance, and pressing the key again will display both distances.
- Copying CSS code: Users can easily copy CSS code by pressing 'ctrl + c' or 'command + c'.
Pixel Inspector is a free Chrome add-on developed by lichengtao9508. It falls under the category of Browsers and the subcategory of Add-ons & Tools. With its convenient features, it offers developers and designers a valuable tool for inspecting webpage elements.
