ความกว้างและความสูงของรูปภาพใน HTML

หากตั้งค่าทั้งความกว้างและความสูงพร้อมกัน รูปภาพอาจจะบิดเบี้ยวได้ ตัวอย่างเช่น หาก ตั้งความกว้างเป็น 100 พิกเซล และความสูง เป็น 70px รูปภาพสไมลีของเราจะถูกยืดออก ทางด้านกว้าง:

html<img src="smile.png" width="100" height="70">

Результат:

รูปภาพไม่จำเป็นต้องบิดเบี้ยวเสมอไป เพราะเรา สามารถตั้งทั้งความกว้างและความสูงเป็น 100 พิกเซล ในกรณีนี้รูปภาพของเรา จะเล็กลงกว่าเดิม (เดิมคือ 130) แต่สัดส่วนจะไม่บิดเบี้ยว:

html<img src="smile.png" width="100" height="100">

Результат: