[ad_1]
Firefox là "nhà phát triển chương trình đào tạo" có nhiều công cụ tuyệt vời để giúp công việc của chúng tôi dễ dàng hơn. Bạn có thể tìm thấy nhiều hơn về bộ sưu tập công cụ của nó trên trang web Công cụ dành cho nhà phát triển Firefox và cũng có thể dùng thử Trình duyệt phiên bản dành cho nhà phát triển có nhiều tính năng và công cụ đang được thử nghiệm.
Đối với bài đăng này, tôi đã liệt kê 10 công cụ tiện dụng bạn có thể thích từ bộ sưu tập công cụ dành cho nhà phát triển của nó. Tôi cũng đã trình bày những gì các công cụ này có thể làm với GIF cộng với cách truy cập chúng để tham khảo nhanh.
Đọc thêm: 40 Tiện ích Firefox để có năng suất tốt hơn
1. Xem thước kẻ ngang và dọc
thước kẻ . Để làm cho điều này xuất hiện trên cửa sổ công cụ dành cho nhà phát triển:
- Chuyển đến "Tùy chọn hộp công cụ".
- Trong phần "Các nút hộp công cụ khả dụng", hãy chọn hộp kiểm " Chuyển đổi thước kẻ cho trang ".
2. Chụp ảnh màn hình bằng cách sử dụng bộ chọn CSS
ảnh chụp màn hình --selector any_unique_css_selector . Để làm cho điều này xuất hiện trên cửa sổ công cụ dành cho nhà phát triển:
- Nhấp vào "Tùy chọn hộp công cụ" và trong phần "Nút hộp công cụ khả dụng".
- Kiểm tra " Chụp ảnh toàn màn hình" .
3. Chọn màu từ các trang web
Xem các trang web trong 3D giúp giải quyết các vấn đề về bố cục. sẽ có thể thấy các yếu tố được xếp lớp khác nhau rõ ràng hơn trong chế độ xem 3D. Để xem trang web ở chế độ 3D, hãy nhấp vào nút công cụ "Chế độ xem 3D".
Để làm cho điều này xuất hiện trên cửa sổ công cụ dành cho nhà phát triển, nhấp vào "Tùy chọn hộp công cụ" và trong phần "Nút hộp công cụ khả dụng", chọn hộp kiểm " Chế độ xem 3D ".
5. Xem kiểu trình duyệt
Kiểu trình duyệt bao gồm hai loại: kiểu mặc định a Trình duyệt chỉ định cho mọi thành phần và các kiểu dành riêng cho trình duyệt (các kiểu có tiền tố trình duyệt). Bằng cách xem qua các kiểu trình duyệt, bạn có thể chẩn đoán mọi sự cố ghi đè trong biểu định kiểu của bạn và cả biết về bất kỳ phong cách cụ thể nào của trình duyệt hiện có.
Để truy cập "Kiểu trình duyệt" thông qua menu:
- Chuyển đến ☰> Nhà phát triển > Thanh tra .
- Nhấp vào tab "Tính toán" ở phần bên phải.
- Kiểm tra hộp kiểm "Kiểu trình duyệt".
Bạn cũng có thể mở tab " Thanh tra " thông qua phím tắt Ctrl + Shift + C "Kiểu trình duyệt".
6. Vô hiệu hóa JavaScript cho phiên hiện tại
Để luôn luôn thực hiện tốt nhất và khả năng tương thích trình đọc màn hình để mã hóa bất kỳ trang web nào theo cách mà chức năng của nó không bị cản trở trong môi trường bị vô hiệu hóa javascript. Để kiểm tra các môi trường như vậy, bạn có thể vô hiệu hóa JavaScript cho phiên bạn đang làm việc trong .
Để tắt JavaScript cho phiên hiện tại, nhấp vào "Tùy chọn hộp công cụ" và trong phần "Cài đặt nâng cao", chọn hộp kiểm " Tắt JavaScript *".
7. Ẩn kiểu CSS khỏi trang
Giống như JavaScript, do lo ngại về khả năng truy cập, nó là tốt nhất để thiết kế trang web theo cách các trang vẫn có thể đọc được ngay cả khi không có bất kỳ kiểu nào . Để xem trang trông như thế nào mà không có bất kỳ kiểu nào, bạn có thể vô hiệu hóa chúng trong các công cụ dành cho nhà phát triển.
Để xóa mọi kiểu CSS (nội tuyến, nội bộ hoặc bên ngoài) được áp dụng trên trang web, chỉ cần nhấp vào biểu tượng con mắt của biểu định kiểu được liệt kê trong tab "Trình chỉnh sửa kiểu". Nhấp vào nó một lần nữa để trở lại chế độ xem ban đầu.
Để truy cập "Trình chỉnh sửa kiểu" thông qua menu, hãy truy cập vào ☰> Nhà phát triển > Trình chỉnh sửa kiểu (phím tắt: Shift + F7 .
8. Xem trước phản hồi nội dung HTML đối với yêu cầu
Các công cụ dành cho nhà phát triển Firefox có tùy chọn để xem trước HTML phản hồi kiểu nội dung . Điều này giúp nhà phát triển xem trước bất kỳ chuyển hướng 302 nào và kiểm tra xem có bất kỳ thông tin nhạy cảm nào được đưa ra hay không trong phản hồi.
Để truy cập "Xem trước" thông qua menu:
- Chuyển đến ☰> Nhà phát triển > Mạng (phím tắt: Ctrl + Shift + Q ].
- Mở trang web bạn chọn hoặc tải lại trang hiện tại, nhấp vào yêu cầu mong muốn (có phản hồi HTML) từ danh sách yêu cầu.
- Nhấp vào tab " Xem trước " ở phần bên phải.
9. Xem trước trang web ở các kích thước màn hình khác nhau
Ctrl + Shift + M .
Để xuất hiện nút công cụ "Chế độ thiết kế đáp ứng", nhấp vào "Tùy chọn hộp công cụ" và trong phần "Nút hộp công cụ khả dụng", đánh dấu vào hộp kiểm "Chế độ thiết kế đáp ứng".
10. Chạy JavaScript trên các trang
Shift + F4
Để làm cho nút công cụ "Scratchpad" xuất hiện trên cửa sổ công cụ dành cho nhà phát triển để sử dụng nhanh: nhấp vào " Tùy chọn hộp công cụ " và trong phần " Các nút hộp công cụ có sẵn " kiểm tra " Hộp kiểm Scratchpad [ .
Source link: webdesignernews