Đo kích thước các thành phần trong website với IE

Không biết ý trời có phải kêu tôi coi tiếp “Đảo Hải Tặc” hay bắt tôi làm việc đây nữa, muốn xách xe chạy nhong nhong cũng không được : người giữ xe đã khóa cổng và “go home” từ kiếp nào rồi !

Haizz, xe và chỗ giữ xe luôn là vấn đề lâu nay của tôi, đau cái đầu ! Thôi thì ngồi viết tiếp trong khi chờ cơm vậy. Hồi trước, khi đăng hình minh họa cho blog, tôi chưa quan tâm đến độ rộng của hình ảnh nên sau khi đăng, hình không được đẹp do “thiếu trước, hụt sau”.

Sau này tôi biết được độ rộng của phần nội dung trên blog là khoảng 600px và từ đó, tôi luôn luôn resize hình trên blog với độ rộng là 585px rồi up lên host. Có nhiều cách để bạn biết được độ rộng của một cái gì đó trên màn hình là bao nhiêu pixel. Hồi trước tôi chỉ đoán và sau nhiều lần thử nghiệm thì tìm ra kích thước phù hợp là 585px. Nhưng hôm nay tôi muốn giới thiệu đến mọi người một công cụ đo màn hình (màn hình của Internet Explorer) được tích hợp trong phiên bản IE8 hoặc IE9, nhờ đó, bạn có thể đo được kích thước của bất kỳ thứ gì hiện ra trên một trang web…

Và vì công cụ này được tích hợp trong IE nên nó chỉ có sử dụng bên trong IE mà thôi. Bạn mở trang web có thứ muốn đo độ rộng ra. Khi trang web đó hiển thị xong, bạn bấm phím F12 để mở công cụ “Developer Tools”. Bạn sẽ thấy một menu hiện ra như sau :

Đo kích thước các thành phần trong website với IE

Vào menu Tools > chọn “Show ruler” > một hộp thoại nhỏ xuất hiện.

Đo kích thước các thành phần trong website với IE

Mặc định thuộc tính “Snap to X/Y axis” sẽ được chọn. Bạn có thể sử dụng ngày bằng cách bấm+giữ chuột+kéo ngang > một cây thước sẽ hiển thị và bạn có thể đo được khoảng cách từ 2 điểm với đơn vị tính là pixel. Đồng thời, khi bạn bấm chuột vào một điểm, nó cũng hiển thị cho bạn tọa độ của điểm đó ở dạng (X,Y).

Đo kích thước các thành phần trong website với IE

Bạn có thể đo kích thước chính xác của các đối tượng trên web, công cụ này có thể tự nhận dạng đối tượng và đo cho bạn. Từ hộp thoại của nó, bạn chọn thuộc tính “Snap to element” > rê chuột vào vùng hoặc đối tượng muốn đo, nó sẽ tự động khoanh đối tượng đó bằng một đường viền màu xanh.

1 Comment
  1. chà, cái này mới bik ah nha… hồi trước h toàn dùng firefox ko ah nên dùng thêm cái addon MeasureIt

Ý kiến phản hồi