Размеры изображения

Размер каждого изображения задается двумя параметрами: ширина и высота. У тега < img> есть соответствующие параметры: width и height. Эти параметры принимают значения в пикселах (px).

Вы можете задать истинные размеры изображения:

< img src=" img/1.png" width=" 176" height=" 146" >

Это делать необязательно, но полезно, т.к. немного ускоряет процесс загрузки странички браузером (браузеру не приходится самостоятельно вычислять эти величины). Если размеры изображения сразу заданы в параметрах тега < img>, то под данное изображение будет выделено место на страничке, и структура странички при загрузке уже не будет меняться - текст прыгать, например.

А можете увеличить или уменьшить изображение, присвоив параметрам width и height другие значения. Причем, если вы хотите пропорционально изменить оба параметра, достаточно указать новое значение только одному из них, а второй - просто опустить. Браузер вычислит его автоматически.

Например, чтобы увеличить наше изображение в 1, 5 раза, можно написать:

< img src=" img/1.png" width=" 264" > или < img src=" img/1.png" width=" 264" height=" 219" >

Результат будет один:

Еще параметры width и height могут принимать значения в процентах. Но! Следует учесть, что это проценты от размера окна браузера. В таком случае тоже можно указать только один параметр, а второй - опустить.

Например, если мы хотим, чтобы изображение по ширине занимало ровно половину нашей странички, надо написать следующее:

< img src=" img/1.png" width=" 50%" >

И мы получим: