Свойство height - это ключевой инструмент для точного контроля за вертикальным размером области содержимого элемента. Оно позволяет задать именно ту высоту, которая вам нужна.
Что произойдет, если контент «не помещается»? Если объем данных превышает заданную высоту, они выйдут за пределы элемента. Чтобы избежать этого хаоса и удержать всё в рамках, используйте свойства overflow. В таком случае, при переполнении, автоматически появится удобная полоса прокрутки. А чтобы наглядно видеть эти границы, рекомендуем установить фоновый цвет или рамку - так вы сразу заметите любые несоответствия.
Важно понимать, как рассчитывается итоговый размер. Общая высота элемента складывается по следующей формуле: height + padding (верхний и нижний) + border (верхний и нижний). Например, если вы зададите: height: 500px, padding: 5px, border 1px, то общая высота элемента получится 512px.
Примечание: свойство height работает только с картинками и блочными элементами.
| Значение по умолчанию: | auto |
| Наследуется: | нет |
| Версия: | CSS1 |
| Синтаксис JavaScript: | object.style.height="50px" |
| Значение | Описание |
| auto | Браузер автоматически определяет высоту. |
| размер | Определяет высоту в единицах измерения CSS. |
| % | Высота указывается в процентах и высчитывается в зависимости от высоты родительского элемента. |
| inherit | Указывает, что значение наследуется от родительского элемента. |
Пример html head style img.normal { height: auto; } img.big { height: 120px; } /style /head body img class="normal" src="logocss.gif" width="95" height="84"br img class="big" src="logocss.gif" width="95" height="84" /body /html