ما هو Layout Debugger؟

Layout Debugger هو إضافة Chrome تم تطويرها بواسطة cdsnowden، والميزة الرئيسية لها هي "Chrome extension for highlighting DOM elements to better debug layout issues".

لقطات شاشة التمديد

تحميل ملف CRX للإضافة Layout Debugger

قم بتنزيل ملفات الامتداد Layout Debugger بتنسيق crx ، وقم بتثبيت الامتدادات يدويًا في متصفح Chrome ، أو شارك ملفات crx مع الأصدقاء لتثبيت الامتدادات بسهولة.

تعليمات استخدام التمديد

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

معلومات أساسية عن التمديد

الاسم	Layout Debugger
ID	gkamnoiedmidgolhlihkamjpfccohilb
عنوان URL الرسمي	https://chromewebstore.google.com/detail/layout-debugger/gkamnoiedmidgolhlihkamjpfccohilb
الوصف	Chrome extension for highlighting DOM elements to better debug layout issues
حجم الملف	251 KB
عدد التثبيتات	897
النسخة الحالية	1.7
آخر تحديث	2022-04-19
تاريخ النشر	2017-07-31
تقييم	4.00/5 مجموع تقييمات 3
المطور	cdsnowden
البريد الإلكتروني	[email protected]
نوع الدفع	free
موقع الإضافة	https://github.com/Recidvst/Layout-Debugger
عنوان صفحة المساعدة	https://github.com/Recidvst/Layout-Debugger#support
اللغات المدعومة	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" ] }