Код вашей страницы

<html>
<head>
<style type="text/css">
p.little
{
max-height:40px;

overflow:auto;
}

p.red{

color:red;}
</style>
</head>

<body>
<p class="little">Максимальная высота этого параграфа равна 40px. Максимальная высота этого параграфа равна 40px. Максимальная высота этого параграфа равна 40px. Максимальная высота этого параграфа равна 40px. Максимальная высота этого параграфа равна 40px. Максимальная высота этого параграфа равна 40px. Максимальная высота этого параграфа равна 40px. Максимальная высота этого параграфа равна 40px. Максимальная высота этого параграфа равна 40px. Максимальная высота этого параграфа равна 40px. Максимальная высота этого параграфа равна 40px. Максимальная высота этого параграфа равна 40px.</p>

<p class="red">Я специально ограничил высоту этого параграфа и задал свойству overflow значение auto, чтобы было видно, что параграф действительно ограничен во высоте.</p>
</body>
</html>

Результат в окне браузера

Максимальная высота этого параграфа равна 40px. Максимальная высота этого параграфа равна 40px. Максимальная высота этого параграфа равна 40px. Максимальная высота этого параграфа равна 40px. Максимальная высота этого параграфа равна 40px. Максимальная высота этого параграфа равна 40px. Максимальная высота этого параграфа равна 40px. Максимальная высота этого параграфа равна 40px. Максимальная высота этого параграфа равна 40px. Максимальная высота этого параграфа равна 40px. Максимальная высота этого параграфа равна 40px. Максимальная высота этого параграфа равна 40px.

Я специально ограничил высоту этого параграфа и задал свойству overflow значение auto, чтобы было видно, что параграф действительно ограничен во высоте.

К примерам CSS >> В раздел CSS >> На главную >>


HTML-верстка: инструменты и приемы профессиональной front-end разработки