Better Ruler

A ruler which can snaps around web elements for easier measurement. Provide convenience for front-end development and ui design.

• Click on the plugin icon to run the plugin. Click again to exit.
• Hold down Alt/Option while moving the mouse to display the size of the element at the mouse position in real time. Hold down the left button and move, it will automatically snap to the edge of the element.
• Double-click the current layer to enter the editing mode, in which the layer can be dragged and resized. Press Backspace to delete the current layer. Double-click on the layer again (or press Esc) to exit edit mode.
• Press f(default, configurable) to show or hide the toolbar.
• Press shift to show or hide the size.
• You can use alt+z to activate/deactivate the plug-in. If it doesn't work, you can go to chrome://extensions/shortcuts to bind the key yourself. Or, After activating the plugin once, you can double-press z (default, configurable) to activate/deactivate the plug-in.
• Go to chrome://extensions, find this plug-in and turn on allow access to file URL to take effect for local html files.