Tiện ích trình duyệt Firefox
  • Tiện ích mở rộng
  • Chủ đề
    • cho Firefox
    • Từ điển & gói ngôn ngữ
    • Các trang web trình duyệt khác
    • Tiện ích cho Android
Đăng nhập
Xem trước Debug CSS

Debug CSS bởi Pranay Joshi

Adds outline to all elements on the page to show the culprit element which is changing desired layout hit `Alt+Shift+C ` key to toggle the extension

4.8 (14 reviews)4.8 (14 reviews)
1.232 Users1.232 Users
Bạn sẽ cần Firefox để sử dụng tiện ích mở rộng này
Tải xuống Firefox và tải tiện ích mở rộng
Tải xuống tập tin

Siêu dữ liệu mở rộng

Ảnh chụp màn hình
Về tiện ích mở rộng này
Adds outline to all elements on the page to show the culprit element which is changing desired layout
# Debug CSS

A lightweight extension for Mozilla Firefox to show outline of all the element exist on page.

while working on web page development the one of the difficult part is to position the element as required and check which element affecting the other one.

This Mozilla Firefox extension allows user to see outline on every element of the page. Hold the keyboard Ctrl button and hover element it will show the element details along with the value.

----------

# Usage

Post installation simply click on the extension icon to turn it On or Off.

If you are a keyboard shortcut lover like me simply hit `Alt+Shift+C ` key to toggle the extension.


----------

# How it works?

This extension works on CSS outline attribute:

add the below code snippet in any CSS of a web page


`
* {
outline: 1px solid red;
}`

The extension does the same the only thing is; it gives different color to different element(s) while the code snippet adds red outline to every element.

----------

# Other work and repository

[A lightweight customizable plugin for jQuery to show horizontal length in form of vertical progress bar.](https://github.com/pranayjoshicse/VerLim.js)


[listed on jqueryscript.net](https://www.jqueryscript.net/other/Simple-Custom-Reading-Indicator-with-jQuery-VerLim-js.html)

[Demo](https://www.jqueryscript.net/demo/Simple-Custom-Reading-Indicator-with-jQuery-VerLim-js/)


----------

# More about me

[twitter.](https://twitter.com/pranayjoshicse)
[about me.](https://about.me/pranayjoshi)
Được xếp hạng 4,8 (bởi 1 người dùng)
Đăng nhập để đánh giá tiện ích này
Chưa có xếp hạng nào

Đã lưu xếp hạng sao

5
12
4
1
3
1
2
0
1
0
Đọc tất cả 14 đánh giá
Thêm thông tin
Liên kết tiện ích
  • Email hỗ trợ
Phiên bản
1.1resigned1
Kích cỡ
24,12 KB
Cập nhật gần nhất
một năm trước (26 Thg 04 2024)
Thể loại có liên quan
  • Phát triển Web
  • Diện mạo
Giấy phép
Giấy phép MIT
Lịch sử các phiên bản
  • Xem tất cả phiên bản
Thêm vào bộ sưu tập
Báo cáo tiện ích này
Tiện ích mở rộng khác của Pranay Joshi
  • Chưa có xếp hạng nào

  • Chưa có xếp hạng nào

  • Chưa có xếp hạng nào

  • Chưa có xếp hạng nào

  • Chưa có xếp hạng nào

  • Chưa có xếp hạng nào

Đi đến trang chủ Mozilla

Tiện ích

  • Giới thiệu
  • Blog tiện ích Firefox
  • Extension Workshop
  • Trung tâm nhà phát triển
  • Chính sách nhà phát triển
  • Blog cộng đồng
  • Diễn đàn
  • Báo cáo một lỗi
  • Hướng dẫn đánh giá

Trình duyệt

  • Desktop
  • Mobile
  • Enterprise

Sản phẩm

  • Browsers
  • VPN
  • Relay
  • Monitor
  • Pocket
  • Bluesky (@firefox.com)
  • Instagram (Firefox)
  • YouTube (firefoxchannel)
  • Riêng tư
  • Cookie
  • Pháp lý

Trừ trường hợp khác đã ghi chú, nội dung trên trang này được cấp phép theo giấy phép Creative Commons Attribution Share-Alike v3.0 hoặc bất kỳ phiên bản nào sau này.