Атрибут width
Атрибут width задает ширину картинки,
которая задана тегом
img.
В настоящее время данный атрибут допустимо
использовать только для картинок,
iframe,
video
и некоторых других тегов.
Допускается указывать значения в пикселях или процентах. В случае задания размера в процентах они будут взяты от ширины родителя. В случае задания размера в пикселях единицы измерения не указываются.
Если для картинки не задана ни ширина, ни высота - картинка будет иметь свой реальный размер. Если задана высота - картинка станет заданной высоты, а по ширине подстроится так, чтобы ее пропорции не были искажены. Если задана только ширина - аналогично, картинка подстроится по высоте так, чтобы сохранить пропорции. Если задана и ширина, и высота - пропорции картинки могут быть искажены (а может и нет, как угадаете). Если ширина или высота (или оба вместе) больше реальной - картинка увеличится, но потеряет в качестве.
Рекомендуется задавать ширину и высоту картинкам в атрибутах - в этом случае браузер быстрее будет загружать изображения - ему нет нужды вычислять размер каждой картинки после ее получения.
Не рекомендуется уменьшать реальные
размеры картинки без необходимости. К примеру,
реальный размер картинки 1000 на 1000
пикселей, а вы ей зададите ширину в 100px.
В этом случае картинка на экране будет выглядеть
на 100 пикселей, однако иметь размер
на всю тысячу и, соответственно, загружаться
намного дольше.
Примеры работы смотрите тут:
тег img.
