Основы работы с XHTML и CSS

         

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


Если не определено иначе, изображение выводится со своими исходными значениями ширины и высоты. Используя стили width и/или height, можно изменить размер изображения для вывода. Если размер изображения нужно изменить с сохранением пропорции, то надо закодировать только один размер, ширину или высоту. Браузер определяет соответствующий размер для другого направления, чтобы сохранить пропорцию. Однако можно намеренно исказить изображение, задавая непропорциональные значения для ширины и высоты.

Следующее изображение выводится в двух размерах - в исходном и в два раза меньше исходного размера. Изменяется только ширина, чтобы браузер задал высоту с сохранением пропорциональности.

<img src="Homer.gif" style="width:90px; height:120px" alt="Изображение Гомера"/> <img src="Homer.gif" style="width:60px" alt="Изображение Гомера"/>


Рис. 5.10.  Изображение в полный размер и в 1/2 размера

При изменении размера изображения лучше не пытаться делать изображение больше исходного размера. Его исходный размер имеет наилучшее и самое четкое разрешение. При увеличении изображения может происходить "пикселизация", приводящая к потере четкости. Большинство компьютеров выводят изображения с разрешением 72 dpi (dots per inch - точек на дюйм). Обычно бывает достаточно сохранять и выводить изображения с этим разрешением. Сохранение изображений с более высоким разрешением не создает заметного улучшения качества выводимого изображения и приводит к большим размерам файлов, которые увеличивают время загрузки.



Содержание раздела