Apa itu Layout Debugger?

Layout Debugger adalah ekstensi Chrome yang dikembangkan oleh cdsnowden, dan fitur utamanya adalah "Chrome extension for highlighting DOM elements to better debug layout issues".

Screenshot Ekstensi

Unduh Berkas CRX Ekstensi Layout Debugger

Unduh file ekstensi Layout Debugger dalam format crx, pasang ekstensi Chrome secara manual di peramban, atau bagikan file crx dengan teman untuk menginstal ekstensi Chrome dengan mudah.

Petunjuk Penggunaan Ekstensi

- 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..

Informasi Dasar Ekstensi

Nama	Layout Debugger
ID	gkamnoiedmidgolhlihkamjpfccohilb
URL Resmi	https://chromewebstore.google.com/detail/layout-debugger/gkamnoiedmidgolhlihkamjpfccohilb
Deskripsi	Chrome extension for highlighting DOM elements to better debug layout issues
Ukuran File	251 KB
Jumlah Instalasi	897
Versi Saat Ini	1.7
Terakhir Diperbarui	2022-04-19
Tanggal Publikasi	2017-07-31
Penilaian	4.00/5 Total 3 Penilaian
Pengembang	cdsnowden
Email	[email protected]
Tipe Pembayaran	free
Situs Ekstensi	https://github.com/Recidvst/Layout-Debugger
URL Halaman Bantuan	https://github.com/Recidvst/Layout-Debugger#support
Bahasa yang Didukung	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" ] }