Tùy chỉnh giao diện của trình kiểm tra web Chrome

Question

Tôi đã phát mệt vì vô số vấn đề mà tôi dường như gặp phải hàng ngày với Firefox và tôi đang cố gắng chuyển sang Chrome một lần nữa.

Một trong những điều khiến tôi thất vọng là bố cục của các tab trong thanh tra. Trong firebug họ là tất cả dọc theo đầu vì vậy nếu tôi muốn các số liệu của một mục nó cực kỳ đơn giản. Trong Chrome, tôi luôn cuộn lên xuống.

Có cách nào để thay đổi cách thức hoạt động không? Tất cả những gì tôi muốn làm là thay đổi cách bố trí thành một thứ tương tự như Firebug.

Chúc mừng!

Answer 1

Trình kiểm tra web Chrome chỉ là một ứng dụng web, vì vậy rất tùy chỉnh. Bạn có thể tải xuống bản sao của HTML/CSS/JS của devtools và yêu cầu Chrome sử dụng nó với cờ dòng lệnh. Một số nguồn lực dành cho bạn:

• Chạy của riêng devtools frontend
• Tùy look and feel of elements tab
• liên quan SO câu hỏi: Chrome "Developer Tools" element - hide annoying yellow dimensions box
• Danh sách Chrome command line flags cụ

Answer 2

Dev chỉ là CSS/JavaScript để bạn có thể làm bất cứ điều gì bạn muốn.

Nếu bạn xem trang này video, Paul Irish cho biết cách chạy bản Chrome và trỏ đến mã công cụ dành cho nhà phát triển của riêng bạn. Một kiểu ngầu!

Answer 3

CSS của devtools là chrome-devtools://devtools/devTools.css (sao chép và dán địa chỉ vào thanh địa chỉ).

Override phong cách sử dụng Custom.css mà sống tại địa chỉ:

• C:\Users\<user>\AppData\Local\Google\Chrome\User Data\Default\User StyleSheets trên Windows
• ~/Library/Google/Chrome/Default/User StyleSheets trên OS X