Layout Debugger là gì?

Layout Debugger là một tiện ích mở rộng Chrome được phát triển bởi cdsnowden, và tính năng chính của nó là "Chrome extension for highlighting DOM elements to better debug layout issues".

Ảnh Chụp Màn Hình của Tiện Ích Mở Rộng

Tải xuống tệp CRX của tiện ích mở rộng Layout Debugger

Tải xuống các tệp mở rộng Layout Debugger dưới định dạng crx, cài đặt các tiện ích mở rộng Chrome bằng tay trong trình duyệt hoặc chia sẻ các tệp crx với bạn bè để dễ dàng cài đặt các tiện ích mở rộng Chrome.

Hướng Dẫn Sử Dụng Tiện Ích Mở Rộng

- Identifying too-wide overflowing objects.
- Distinguishing block from inline elements.
- Helping to keep track of element alignment.

Adds a distinct colour outline to each visible DOM element, as well as providing a visual prompt for overflowing divs.

display: block; => blue;
display: inline; => purple;
overflowing the viewport => red!
etc..

Thông Tin Cơ Bản về Tiện Ích Mở Rộng

Tên	Layout Debugger
ID	gkamnoiedmidgolhlihkamjpfccohilb
URL Chính Thức	https://chromewebstore.google.com/detail/layout-debugger/gkamnoiedmidgolhlihkamjpfccohilb
Mô tả	Chrome extension for highlighting DOM elements to better debug layout issues
Kích Thước Tệp	251 KB
Số Lần Cài Đặt	897
Phiên Bản Hiện Tại	1.7
Cập Nhật Lần Cuối	2022-04-19
Ngày Phát Hành	2017-07-31
Đánh Giá	4.00/5 Tổng số 3 Đánh Giá
Nhà Phát Triển	cdsnowden
Email	[email protected]
Loại Thanh Toán	free
Trang Web Mở Rộng	https://github.com/Recidvst/Layout-Debugger
URL Trang Trợ Giúp	https://github.com/Recidvst/Layout-Debugger#support
Ngôn Ngữ Được Hỗ Trợ	en-GB
manifest.json
{ "update_url": "https:\/\/clients2.google.com\/service\/update2\/crx", "manifest_version": 2, "name": "Layout Debugger", "short_name": "Layout Debugger", "description": "Chrome extension for highlighting DOM elements to better debug layout issues", "version": "1.7", "author": "Chris Snowden", "icons": { "19": "images\/icon19dark.png", "38": "images\/icon38dark.png", "128": "images\/icon128dark.png" }, "browser_action": { "default_icon": { "19": "images\/icon19dark.png", "38": "images\/icon38dark.png" }, "default_title": "Toggle highlighter" }, "background": { "scripts": [ "background.js" ], "persistent": false }, "content_scripts": [ { "matches": [ "" ], "js": [ "highlight.js" ] } ], "permissions": [ "activeTab" ], "web_accessible_resources": [ "*.png", "highlight.js" ] }