Định cấu hình giao diện và hành vi của Công cụ cho nhà phát triển cũng như các bảng điều khiển của công cụ này bằng cách sử dụng Cài đặt > Lựa chọn ưu tiên. Thẻ này liệt kê cả các lựa chọn tuỳ chỉnh chung và các lựa chọn dành riêng cho bảng điều khiển.
Để đặt lựa chọn ưu tiên, hãy mở phần Cài đặt > Lựa chọn ưu tiên rồi di chuyển đến một trong các phần được mô tả tiếp theo.

Để tìm hiểu chức năng của từng chế độ cài đặt, hãy tìm tên của chế độ cài đặt đó trên trang này rồi nhấp vào biểu tượng để mở rộng phần mô tả.
Tài liệu tham khảo này cho biết các chế độ cài đặt khác nhau bằng các biểu tượng sau:
Hộp đánh dấu
- Danh sách thả xuống
Không dùng nữa
Để khôi phục các lựa chọn ưu tiên mặc định, hãy di chuyển đến cuối thẻ Lựa chọn ưu tiên rồi nhấp vào Khôi phục chế độ mặc định và tải lại.
Giao diện
Phần này liệt kê các tuỳ chọn giúp tuỳ chỉnh giao diện của Công cụ cho nhà phát triển.
Chủ đề
đặt chủ đề màu sắc cho giao diện người dùng của DevTools.
Bố cục bảng điều khiển
sắp xếp các ngăn trong bảng điều khiển.
Ảnh hưởng đến Elements (Phần tử) > Styles (Kiểu) và các thẻ đồng cấp, cũng như ngăn Sources (Nguồn) > Debugger (Trình gỡ lỗi). Tuỳ chọn tự động làm cho bố cục phụ thuộc vào chiều rộng của Công cụ cho nhà phát triển.
Ngôn ngữ
đặt ngôn ngữ cho giao diện người dùng của Công cụ cho nhà phát triển.
Để áp dụng chế độ cài đặt này, hãy tải lại Công cụ cho nhà phát triển.
Bật phím tắt Ctrl/Cmd + 0-9 để chuyển đổi bảng điều khiển cho phép bạn mở bảng điều khiển bằng bàn phím.
Video này hướng dẫn cách chuyển đổi giữa các thẻ bằng phím tắt tương ứng.
Tắt lớp phủ trạng thái tạm dừng ẩn lớp phủ Đã tạm dừng trong trình gỡ lỗi
trong khung nhìn khi quá trình thực thi mã bị tạm dừng.
Hiển thị tính năng mới sau mỗi lần cập nhật sẽ tự động mở thẻ ngăn Tính năng mới sau mỗi lần cập nhật Chrome.
Nguồn
Phần này liệt kê các lựa chọn để tuỳ chỉnh bảng điều khiển Nguồn.
Tìm trong tập lệnh nội dung và tập lệnh ẩn danh cho phép bạn tìm kiếm tất cả tệp JavaScript đã tải, bao gồm cả những tệp trong tiện ích của Chrome, bằng thẻ Tìm kiếm.
Video này hướng dẫn cách tìm kiếm văn bản trong tệp nguồn của tiện ích.
Tự động hiển thị các tệp trong thanh bên chọn các tệp trong ngăn Nguồn > Trang khi bạn chuyển đổi giữa các thẻ trong Trình chỉnh sửa.
Video này cho thấy cách bảng điều khiển Nguồn chọn các tệp trong cây điều hướng khi bạn chuyển đổi giữa các thẻ khi bật tuỳ chọn này.
Bật bản đồ nguồn JavaScript cho phép Công cụ cho nhà phát triển tìm nguồn của các tệp JavaScript được tạo hoặc rút gọn.
Bật chức năng di chuyển tiêu điểm bằng phím Tab giúp phím
Tab di chuyển tiêu điểm bên trong Công cụ cho nhà phát triển thay vì chèn ký tự Tab trong Trình chỉnh sửa.
Cần tải lại Công cụ cho nhà phát triển.
Video này trước tiên cho thấy các ký tự Tab được chèn bằng phím Tab. Sau đó, khi bạn bật tuỳ chọn này và tải lại Công cụ cho nhà phát triển, phím Tab sẽ di chuyển tiêu điểm.
Detect indentation (Phát hiện thụt lề) đặt thụt lề thành thụt lề trong tệp nguồn được mở trong Editor (Trình chỉnh sửa).
Cần tải lại Công cụ cho nhà phát triển.
Video này trước tiên cho thấy mức thụt lề mặc định là 8 dấu cách. Sau đó, khi bạn bật tuỳ chọn này, tuỳ chọn này sẽ ghi đè thụt lề mặc định thành thụt lề của tệp nguồn.
Tính năng Tự động hoàn thành đưa ra các đề xuất hữu ích trong Trình chỉnh sửa.
Video này ban đầu không có đề xuất nào. Sau đó, khi bạn bật tuỳ chọn này, Trình chỉnh sửa sẽ hiển thị các đề xuất để hoàn tất lệnh.
Tự động đóng ngoặc sẽ tự động thêm dấu ngoặc hoặc thẻ đóng khi bạn nhập dấu ngoặc hoặc thẻ mở.
Video này cho thấy việc nhập dấu ngoặc mở trước và sau khi bật tính năng tự động đóng ngoặc.
Tính năng so khớp dấu ngoặc sẽ gạch chân và làm nổi bật bằng màu đỏ nhạt trong Trình chỉnh sửa đối với dấu ngoặc vuông, dấu ngoặc nhọn hoặc dấu ngoặc đơn không có cặp.
Thu gọn mã cho phép bạn thu gọn và mở rộng các khối mã trong dấu ngoặc nhọn trong Trình chỉnh sửa.
Cần tải lại Công cụ cho nhà phát triển.
Video này cho thấy cách thu gọn các khối mã khi bạn bật tuỳ chọn này.
Show whitespace characters (Hiện ký tự khoảng trắng)
hiển thị các ký tự khoảng trắng trong Editor (Trình chỉnh sửa).
Cần tải lại Công cụ cho nhà phát triển. Các lựa chọn có chức năng như sau:
- All (Tất cả) biểu thị tất cả ký tự khoảng trắng dưới dạng dấu chấm (
...). Ngoài ra, Editor (Trình chỉnh sửa) biểu thị ký tự Tab dưới dạng một dòng (—). - Trailing (Khoảng trắng ở cuối) làm nổi bật các ký tự khoảng trắng ở cuối dòng bằng màu đỏ nhạt.
Hiển thị các giá trị biến cùng dòng trong khi gỡ lỗi cho bạn thấy các giá trị biến bên cạnh câu lệnh gán trong khi quá trình thực thi bị tạm dừng.
Lấy tiêu điểm vào bảng điều khiển Nguồn khi kích hoạt một điểm ngắt sẽ mở Nguồn > Trình chỉnh sửa tại dòng có điểm ngắt đã tạm dừng thực thi.
Video này trước tiên cho thấy bảng điều khiển Nguồn không được lấy tiêu điểm khi tạm dừng tại một điểm ngắt. Sau đó, khi bạn bật tuỳ chọn này, Công cụ cho nhà phát triển sẽ mở Trình chỉnh sửa trong bảng điều khiển Nguồn và cho bạn thấy dòng mã có điểm ngắt.
Tự động tạo bản in đẹp cho các nguồn rút gọn giúp các nguồn đó dễ đọc hơn.
Khi được in đẹp, Trình chỉnh sửa có thể hiển thị một dòng mã dài thành nhiều dòng, trước đó là - để cho biết đó là dòng tiếp theo.
Bật bản đồ nguồn CSS cho phép Công cụ cho nhà phát triển tìm nguồn của các tệp CSS được tạo, ví dụ: .scss và hiển thị các tệp đó cho bạn.
Allow scrolling past end of file (Cho phép cuộn qua cuối tệp) cho phép bạn cuộn qua dòng cuối cùng trong Editor (Trình chỉnh sửa).
Video này cho bạn thấy cách cuộn qua phần cuối của tệp khi bạn bật tuỳ chọn này.
Cho phép Công cụ cho nhà phát triển tải các tài nguyên, chẳng hạn như bản đồ nguồn, từ các đường dẫn tệp từ xa. Bị tắt theo mặc định vì lý do bảo mật.
Nếu bạn tắt tính năng này, Công cụ cho nhà phát triển sẽ ghi lại các thông báo tương tự như sau vào Bảng điều khiển:
Thụt lề mặc định
cho phép bạn chọn số lượng dấu cách mà phím
Tab chèn vào Trình chỉnh sửa.
Ví dụ này cho thấy cách đặt mức thụt lề mặc định thành 8 dấu cách trước, sau đó thành ký tự Tab.
Phần tử
Phần này liệt kê các tuỳ chọn giúp tuỳ chỉnh bảng điều khiển Elements (Phần tử).
Hiển thị DOM tối của tác nhân người dùng cho thấy các nút DOM tối trong cây DOM.
Ngắt dòng ngắt các dòng dài trong cây DOM và xuống dòng.
Hiển thị nhận xét HTML cho thấy nhận xét HTML trong cây DOM.
Hiển thị nút DOM khi di chuột chọn nút tương ứng trong cây DOM khi bạn di chuột qua một phần tử trong khung nhìn ở
chế độ kiểm tra.
Video này trước tiên cho thấy các nút DOM không được chọn trong cây DOM. Sau đó, khi bạn bật tuỳ chọn này, bảng điều khiển Elements (Phần tử) sẽ chọn các nút khi di chuột.
Hiện chú thích tính năng kiểm tra chi tiết hiển thị chú thích trong khung nhìn ở chế độ kiểm tra
khi bạn di chuột qua một phần tử.
Show rulers on hover (Hiện thước kẻ khi di chuột) hiển thị thước kẻ trong khung nhìn khi bạn di chuột qua các phần tử trong cây DOM.
Hiện chú giải công cụ tài liệu CSS hiển thị chú giải công cụ kèm theo nội dung mô tả ngắn khi bạn di chuột qua một thuộc tính trong ngăn Kiểu.
Đường liên kết Tìm hiểu thêm sẽ đưa bạn đến Tài liệu tham khảo về CSS của MDN về thuộc tính này.
Mạng
Phần này liệt kê các tuỳ chọn giúp tuỳ chỉnh bảng điều khiển Mạng. Hầu hết các lựa chọn đều giống như trong phần cài đặt của bảng điều khiển.
Lưu giữ nhật ký giống với Lưu giữ nhật ký trong bảng điều khiển Mạng. Lưu các yêu cầu trong các lần tải trang.
Video này trước tiên cho thấy nhật ký yêu cầu được làm mới khi tải lại trang, sau đó được duy trì khi bạn bật tuỳ chọn này.
Ghi nhật ký mạng giống với
Ghi nhật ký mạng trong bảng điều khiển Mạng. Bắt đầu hoặc dừng ghi lại các yêu cầu trong nhật ký mạng.
Bật tính năng chặn yêu cầu mạng chặn các yêu cầu khớp với mẫu trong ngăn Chặn yêu cầu mạng.
Video này trước tiên cho thấy các yêu cầu không bị chặn. Sau đó, khi bạn bật tuỳ chọn này, một mẫu trong ngăn Chặn yêu cầu mạng sẽ chặn các yêu cầu đó.
Vô hiệu hoá bộ nhớ đệm (trong khi Công cụ cho nhà phát triển đang mở) giống với Vô hiệu hoá bộ nhớ đệm trong bảng điều khiển Mạng. Tắt bộ nhớ đệm của trình duyệt.
Cho phép tạo HAR kèm theo dữ liệu nhạy cảm sẽ thêm các lựa chọn vào nút Xuất HAR để bạn có thể xuất kèm theo hoặc không kèm theo dữ liệu nhạy cảm (đã dọn dẹp).
Dữ liệu nhạy cảm là dữ liệu trong các tiêu đề Cookie, Set-Cookie và Authorization.
Mã màu cho các loại tài nguyên làm nổi bật các yêu cầu bằng nhiều màu sắc tuỳ theo loại yêu cầu trong cột Thác nước của nhật ký mạng.
Lựa chọn Nhóm nhật ký mạng theo khung giống với lựa chọn Nhóm theo khung trong bảng điều khiển Mạng. Lựa chọn này nhóm các yêu cầu do khung nội tuyến khởi tạo.
Buộc chặn quảng cáo trên trang web này chặn quảng cáo được phát hiện trên trang trong khi Công cụ cho nhà phát triển đang mở.
Hiệu suất
Phần này liệt kê các tuỳ chọn giúp tuỳ chỉnh bảng điều khiển Hiệu suất.
Thao tác với con lăn chuột trên biểu đồ hình ngọn lửa
chỉ định thao tác cuộn hoặc thu phóng cho con lăn chuột khi bạn di chuyển trên biểu đồ hình ngọn lửa.
Ví dụ này cho thấy cả thao tác cuộn và thu phóng bằng con lăn chuột trên biểu đồ hình ngọn lửa trong bảng điều khiển Hiệu suất.
Giao diện dòng lệnh
Phần này liệt kê các tuỳ chọn để tuỳ chỉnh Console. Hầu hết các tuỳ chọn đều giống như trong phần Cài đặt bảng điều khiển.

Hide network messages (Ẩn thông báo mạng) ẩn thông báo mạng trong Console (Bảng điều khiển).
Video này cho thấy cách ẩn thông báo mạng bằng lựa chọn này trong cả phần Cài đặt và Cài đặt bảng điều khiển.
Selected context only (Chỉ ngữ cảnh đã chọn) khiến Console chỉ hiển thị thông báo cho ngữ cảnh đã chọn: top, iframe, worker hoặc extension.
Video này hướng dẫn cách bật tuỳ chọn này trong cả phần Cài đặt và Bảng điều khiển > Cài đặt, đồng thời chọn bối cảnh trong Bảng điều khiển.
Ghi nhật ký XMLHttpRequests khiến Bảng điều khiển ghi nhật ký XHR và tìm nạp yêu cầu.
Video này hướng dẫn cách bật tuỳ chọn này trong cả phần Cài đặt và Bảng điều khiển > Cài đặt, đồng thời ghi lại thông báo
XHR finished loading vào Bảng điều khiển.
Show timestamps (Hiện dấu thời gian) khiến Console (Bảng điều khiển) hiện dấu thời gian bên cạnh thông báo.
Tự động hoàn thành từ nhật ký giúp Bảng điều khiển đề xuất các lệnh bạn đã chạy trước đó khi nhập.
Bạn có thể tìm thấy lựa chọn tương tự trong phần Console > Cài đặt.
Chấp nhận đề xuất tự động hoàn thành khi nhấn Enter khiến Bảng điều khiển chấp nhận đề xuất đã chọn trong trình đơn thả xuống tự động hoàn thành khi bạn nhấn phím Enter.
Video này cho thấy điều gì xảy ra khi bạn nhấn phím Enter trước và sau khi bật lựa chọn này.
Lựa chọn Group similar messages in console (Nhóm các thông báo tương tự trong bảng điều khiển) giúp Console (Bảng điều khiển) nhóm các thông báo tương tự lại với nhau.
Bạn có thể tìm thấy lựa chọn tương tự trong phần Console > Cài đặt.
Hiện lỗi CORS trong bảng điều khiển khiến Bảng điều khiển hiện lỗi CORS mà bảng điều khiển đã ghi lại.
Bạn có thể tìm thấy lựa chọn tương tự trong Console > Cài đặt.
Đánh giá sớm giúp Bảng điều khiển hiển thị bản xem trước của kết quả khi bạn nhập lệnh.
Bạn có thể tìm thấy lựa chọn tương tự trong phần Console > Cài đặt.
Video này cho thấy nhiều bản xem trước kết quả.
Coi việc đánh giá mã là hành động của người dùng biến mọi lệnh bạn chạy trong Console thành hoạt động tương tác của người dùng.
Nói cách khác, hàm này sẽ đặt navigator.userActivation.isActive thành true khi đánh giá. Bạn có thể tìm thấy lựa chọn tương tự trong Console > Cài đặt.
Video này cho thấy kết quả đánh giá của navigator.userActivation.isActive trước và sau khi bật lựa chọn này.
Tự động mở rộng thông báo console.trace() khiến Bảng điều khiển hiển thị thông báo console.trace() mở rộng khi ghi nhật ký.
Preserve log upon navigation (Lưu giữ nhật ký khi điều hướng) khiến Console (Bảng điều khiển) ghi lại thông báo Navigated to mỗi khi điều hướng và lưu nhật ký trên tất cả các trang.
Bạn có thể tìm thấy lựa chọn tương tự trong Console > Cài đặt.
Phần mở rộng
Phần này liệt kê các tuỳ chọn giúp tuỳ chỉnh cách xử lý đường liên kết cho các tiện ích của Chrome DevTools.
Xử lý đường liên kết
đặt một lựa chọn để mở tệp khi bạn nhấp vào đường liên kết đến tệp nguồn, ví dụ: trong ngăn Phần tử > Kiểu.
Khả năng lưu trữ dài lâu
Phần này liệt kê các tuỳ chọn kiểm soát cách Công cụ cho nhà phát triển lưu các thay đổi bạn thực hiện.
Bật tính năng ghi đè cục bộ giúp Công cụ cho nhà phát triển duy trì những thay đổi bạn thực hiện đối với các nguồn trong quá trình tải trang.
Để biết thêm thông tin, hãy xem phần Ghi đè cục bộ.
Trình gỡ lỗi
Phần này liệt kê các tuỳ chọn kiểm soát hành vi của Trình gỡ lỗi.
Tắt JavaScript cho phép bạn xem giao diện và hoạt động của trang web khi JavaScript bị tắt.
Tải lại trang để xem liệu trang có phụ thuộc vào JavaScript hay không và phụ thuộc như thế nào trong khi tải.
Khi JavaScript bị tắt, Chrome sẽ hiển thị biểu tượng
tương ứng trên thanh địa chỉ và Công cụ cho nhà phát triển sẽ hiển thị biểu tượng cảnh báo bên cạnh Nguồn.
Tắt dấu vết ngăn xếp không đồng bộ sẽ ẩn "toàn bộ câu chuyện" của thao tác không đồng bộ trong Ngăn xếp lệnh gọi.
Theo mặc định, Trình gỡ lỗi sẽ cố gắng theo dõi các thao tác không đồng bộ nếu khung bạn đang sử dụng hỗ trợ tính năng theo dõi đó.
Để biết thêm thông tin, hãy xem phần Xem dấu vết ngăn xếp không đồng bộ.
Toàn cầu
Phần này liệt kê các lựa chọn có hiệu lực chung trong Công cụ cho nhà phát triển.
Tự động mở Công cụ cho nhà phát triển đối với cửa sổ bật lên sẽ mở Công cụ cho nhà phát triển khi bạn nhấp vào các đường liên kết mở thẻ mới. Tức là tất cả các đường liên kết có target=_blank.
Video này trước tiên cho thấy cách nhấp vào một đường liên kết và mở một thẻ mới *mà không cần* Công cụ cho nhà phát triển. Sau đó, khi bạn bật tuỳ chọn này, một thẻ mới sẽ mở ra *bằng* Công cụ cho nhà phát triển.
Tìm kiếm khi bạn nhập khiến Công cụ cho nhà phát triển "chuyển" đến kết quả tìm kiếm đầu tiên khi bạn nhập cụm từ tìm kiếm. Nếu bạn tắt chế độ này, Công cụ cho nhà phát triển sẽ chỉ đưa bạn đến kết quả khi bạn nhấn phím Enter.
Video này trước tiên cho thấy cách Công cụ cho nhà phát triển "nhảy" khi bạn nhập cụm từ tìm kiếm. Sau đó, khi bạn bật tuỳ chọn này, Công cụ cho nhà phát triển sẽ đưa bạn đến kết quả đầu tiên khi bạn nhấn phím Enter.
Đồng bộ hoá
Mục này cho phép bạn thiết lập tính năng đồng bộ hoá chế độ cài đặt giữa các thiết bị.
Bật tính năng đồng bộ hoá chế độ cài đặt cho phép bạn đồng bộ hoá chế độ cài đặt của Công cụ cho nhà phát triển trên nhiều thiết bị.
Để sử dụng chế độ cài đặt này, trước tiên, hãy bật tính năng Đồng bộ hoá Chrome. Để biết thêm thông tin, hãy xem phần Cài đặt đồng bộ hoá.