2012-04-19 16 views
8

Tôi chắc chắn đây là nơi nào đó trong thanh tra công cụ dành cho nhà phát triển, nhưng tôi không thể tìm thấy nó. Tôi sẽ tìm thấy đâu, cho một phần tử đã cho (ví dụ, một div), các kích thước được tính toán (chiều cao và chiều rộng) của một phần tử đã cho mà tôi nhấp chuột phải và chọn "Kiểm tra phần tử"?Cách tìm kích thước tính toán của bất kỳ phần tử nào trong Công cụ dành cho nhà phát triển Chrome?

+0

'Kiểm tra phần tử', nhìn vào ngăn bên phải, nhấp vào 'các kiểu được tính' là bảng điều khiển trên cùng. Hoặc sử dụng bảng điều khiển 'chỉ số'. Nhưng đây không phải là một câu hỏi lập trình, tôi nghĩ vậy. –

Trả lời

14

Chỉ cần di chuột qua tên phần tử trong ruy-băng bên dưới bảng công cụ dành cho nhà phát triển. Phần tử tương ứng sẽ được đánh dấu trong cửa sổ trình duyệt và kích thước xuất hiện ở một góc của nó. Ngoài ra, nếu bạn cuộn xuống ngăn bên phải trong công cụ nhà phát triển, bạn sẽ thấy cửa sổ 'Số liệu' sẽ cung cấp cho bạn kích thước được tính và cả lề, đệm, đường viền, v.v.

Đây là ảnh chụp màn hình của kích thước của div chứa câu hỏi SO của bạn. Lưu ý các kích thước ở góc dưới bên trái của vùng được đánh dấu khi tôi di chuột qua tên div ở dưới cùng. Ở bên phải là cửa sổ Metrics.

Computed Size Screenshot

Click here for bigger image

Đối với câu hỏi tương lai, chỉ cần đề cập đến Google của nice documentation đầu tiên.

+2

+1 câu trả lời tuyệt vời. Cảm ơn bạn đã chụp màn hình! –

+1

Liên kết tài liệu của Google hiện đã bị hỏng. Hiện tại, bạn có thể tìm thấy trang tại https://developer.chrome.com/devtools – OscillatingEthmoid

+3

Trong phiên bản "46.0.2490.86 m", không có "Kiểu được tính toán" và cửa sổ Số liệu cho biết 100% x 100%. :( – LGT

Các vấn đề liên quan