Mẹo sử dụng Yếu tố Kiểm tra trình duyệt Google Chrome

Google Chrome được thiết kế không chỉ dành cho người dùng internet thông thường mà còn cho nhà phát triển web, thường tạo trang web, blog thiết kế, v.v. Kiểm tra phần tử Tùy chọn hoặc Kiểm tra của Google Chrome giúp người dùng tìm thấy một số thông tin về trang web bị ẩn khỏi chế độ xem. Dưới đây là một số mẹo về cách sử dụng phần tử Inspect Element của trình duyệt Google Chrome dành cho Windows PC.

Kiểm tra phần tử của Google Chrome

1] Tìm tệp JavaScript / Media ẩn

Nhiều trang web hiển thị cửa sổ bật lên nếu khách truy cập ở lại trên web trang trong hơn 15 hoặc 20 giây. Hoặc, nhiều lần một hình ảnh, quảng cáo hoặc biểu tượng, mở ra sau khi nhấp vào một nơi nào đó ngẫu nhiên. Để tìm các tệp ẩn này của một trang web, bạn có thể sử dụng tab Nguồn của phần tử Kiểm tra. Nó cho thấy một danh sách cây xem ở phía bên trái có thể được khám phá.

2] Nhận mã màu HEX / RGB trong Chrome

Đôi khi chúng ta có thể thích màu và có thể muốn tìm ra mã màu của nó. Bạn có thể dễ dàng tìm thấy mã màu HEX hoặc RGB được sử dụng trên một trang web cụ thể, sử dụng tùy chọn gốc trong Google Chrome. Nhấp chuột phải vào màu sắc và nhấp vào Kiểm tra . Trong hầu hết các lần, bạn sẽ nhận được mã màu ở phía bên tay phải với CSS khác. Nếu bạn không nhìn thấy nó, tốt, bạn có thể phải sử dụng một số phần mềm chọn màu miễn phí.

TIP : Hãy xem các công cụ trực tuyến Color Picker này.

3] Nhận các mẹo cải thiện hiệu suất trang web

Mọi người đều thích truy cập trang web mở nhanh. Nếu bạn đang thiết kế trang web của mình, bạn nên luôn ghi nhớ điều đó. Có rất nhiều công cụ để kiểm tra và tối ưu hóa tốc độ tải trang. Tuy nhiên, Google Chrome cũng đi kèm với một công cụ sẵn có cho phép người dùng nhận các mẹo để cải thiện tốc độ tải trang web. Để truy cập các công cụ này, hãy vào tab Kiểm tra và đảm bảo Sử dụng mạng , Hiệu suất trang web và Tải lại trang và kiểm tra khi tải được chọn. Sau đó nhấp vào nút Chạy . Nó sẽ tải lại trang và hiển thị cho bạn một số thông tin có thể được sử dụng để làm cho trang nhanh hơn. Ví dụ, bạn có thể nhận được tất cả các tài nguyên không có bộ nhớ cache hết hạn, JavaScript có thể được kết hợp thành một tập tin, vv

4] Kiểm tra đáp ứng

Làm cho trang web đáp ứng rất quan trọng, ngày nay. Có rất nhiều công cụ có thể kiểm tra xem trang web của bạn có hoàn toàn đáp ứng hay không. Tuy nhiên, công cụ này của Google Chrome giúp người dùng biết liệu trang web có đáp ứng hay không cũng như kiểm tra xem trang web sẽ trông như thế nào trên một thiết bị di động cụ thể. Mở bất kỳ trang web nào, nhận tab Kiểm tra phần tử , nhấp vào Nút di động , đặt độ phân giải hoặc chọn thiết bị mong muốn để kiểm tra trang web.

5] Chỉnh sửa trang web trực tiếp

Giả sử bạn đang tạo trang web nhưng bạn nhầm lẫn về màu sắc lược đồ hoặc kích thước menu điều hướng hoặc nội dung hoặc tỷ lệ thanh bên. Bạn có thể chỉnh sửa trang web trực tiếp của mình bằng tùy chọn Kiểm tra phần tử của Google Chrome. Mặc dù bạn không thể lưu các thay đổi trên một trang web trực tiếp, bạn có thể thực hiện tất cả các chỉnh sửa để bạn có thể sử dụng nó hơn nữa. Để làm như vậy, hãy mở Kiểm tra phần tử, chọn thuộc tính HTML từ phía bên trái và thực hiện các thay đổi về kiểu dáng ở phía bên tay phải. Nếu bạn thực hiện bất kỳ thay đổi nào trong CSS, bạn có thể nhấp vào liên kết tệp, sao chép toàn bộ mã và dán vào tệp gốc.

Kiểm tra phần tử của Google Chrome là bạn đồng hành thực sự của mọi nhà phát triển web. Việc bạn đang phát triển trang web một trang hay trang web động không quan trọng, bạn chắc chắn có thể sử dụng những mẹo này.