HTML5 - Tôi có thể sử dụng Chiều rộng và Chiều cao trong IMG không?

Question

Đó là pháp lý để sử dụng mã này:

<img src="...(here image)...." width="50px" height="50px" /> 

Hoặc tôi cần phải sử dụng:

<img src="...(here image)..." style="width: 50px; height: 50px;" /> 

Answer 1

Sử dụng đầu tiên được đề xuất làm gợi ý cho hiển thị của trình duyệt, thứ hai hoạt động.

Trong biểu mẫu đầu tiên, bạn không được thêm 'px'.

http://www.w3.org/TR/html5/embedded-content-0.html#dimension-attributes

Answer 2

Các style = cách được ưa thích ... thực sự nó sẽ là tốt hơn nếu bạn di chuyển mà phong cách vào một tệp css hoặc một thẻ kiểu trong tiêu đề của bạn.

Answer 3

Theo HTML 5 đặc điểm kỹ thuật:

Chiều rộng và chiều cao các thuộc tính trên img ... thể được chỉ định để cung cấp cho kích thước của nội dung trực quan của nguyên tố này

Nguồn: http://www.w3.org/TR/2011/WD-html5-20110113/the-map-element.html#dimension-attributes

Cũng theo H Đặc tả TML 5, tất cả các phần tử có thể có các thuộc tính kiểu. Nguồn: http://www.w3.org/TR/html5/elements.html#the-style-attribute

Vì vậy, vì cả hai được phép, bạn được tự do lựa chọn cái nào phù hợp với sở thích của mình.

Answer 4

CSS được áp dụng cho 'img' sẽ ghi đè lên chiều rộng html cơ bản & thuộc tính chiều cao trên thẻ hình ảnh.

<style> 
    img { 
     width: 100%; 
     height: auto; 
    } 
</style> 

<img src="assets/img/logo.png" width="500" height="100"> 

Đoạn mã trên sẽ dẫn đến hình ảnh trải dài trên toàn bộ chiều rộng của vùng chứa và chiều cao của nó sẽ có chiều rộng tương ứng.

Cách tiếp cận này hữu ích nếu bạn đang tải đồ họa thích hợp cho võng mạc từ khi di chuyển.

Answer 5

Như đã đề cập:

• CSS ghi đè <img> attrinutes trong trường hợp xuất hiện cả hai,
• <img> attrinutes chỉ gợi ý cho trình duyệt.

khác biệt nữa là việc sử dụng các đơn vị:

• trong HTML5 các width và height thuộc tính nên số nguyên mà không đơn vị, được hiểu là pixel CSS. Trong thực tế, brouwsers chịu đựng % (có giá trị trong HTML4), nhưng nếu bạn đặt một cái gì đó như width="5cm" nó sẽ được hiểu là width="5" (ví dụ: 5px).
• Khi bạn sử dụng CSS, bất kỳ đơn vị độ dài và số nguyên không được phép, ví dụ width: 5.5cm là ok. Và bạn nên sử dụng các đơn vị (ví dụ: width: 5 không phải là chiều rộng CSS hợp lệ).

Vì vậy, IMO, bạn nên sử dụng CSS nếu có thể.