Встановлює мінімальну висоту елемента. Значення висоти елемента буде обчислюватися залежно від встановлених значень властивостей height, max-height та min-height. У табл. 1 показано, чим керується браузер при спільному використанні зазначених стильових властивостей.
| Значення властивостей | Висота | ||||
|---|---|---|---|---|---|
| min-height | < | height | < | max-height | height |
| min-height | > | height | > | max-height | min-height |
| min-height | > | height | < | max-height | min-height |
| min-height | < | height | height | ||
| min-height | > | height | min-height | ||
| min-height | > | max-height | min-height | ||
| min-height | < | max-height | max-height | ||
Дані з таблиці слід розуміти так. Якщо значення висоти (height) менше значення min-height, то висота елемента приймається рівною min-height.
Коротка інформація
| Значення за замовчуванням | 0 |
|---|---|
| Успадковується | Ні |
| Застосовується | До всіх елементів, крім малих та таблиць |
| Анімується | Так |
Синтаксис
<code>min-height: <раз заходів> | <відсотки>
Позначення
| Опис | Приклад | |
|---|---|---|
| <тип> | Вказує тип значення. | <розмір> |
| A && B | Значення повинні виводитися в вказаному порядку. | <розмір> && <колір> |
| A | B | Вказує, що потрібно вибрати лише одне значення із запропонованих (A або B). | normal | small-caps |
| A || B | Кожне значення може використовуватися самостійно або спільно з іншими у довільному порядку. | width || count |
| [ ] | Групує значення. | [ crop || cross ] |
| * | Повторювати нуль або більше разів. | [,<час>]* |
| + | Повторювати один або більше разів. | <число>+ |
| ? | Вказаний тип, слово або група не є обов'язковим. | inset? |
| {A, B} | Повторювати не менше A, але не більше B разів. | <радіус>{1,4} |
| # | Повторювати один або більше разів через кому. | <час># |
Значення
В якості значень приймаються пікселі (px), відсотки (%) та інші одиниці виміру, прийняті в CSS. Негативні значення не допускаються.
Приклад
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>min-height</title> <style> footer { background: #66806E url(/example/image/clover.png) no-repeat 20px bottom; /* Параметри фону */
min-height: 80px; /* Мінімальна висота */
color: #E4BC96; /* Колір тексту */
padding: 5px 5px 5px 140px; /* Поля навколо тексту */
}
footer p { margin: 5px 0; }
footer a { color: #FFFDE0; }
</style>
</head>
<body> <footer> <p>Сайт Cloverfield</p> <p><a href="page/techinfo.html">Інформація про сайт</a> <a href="page/activity.html">Про автора</a></p>
</footer>
</body>
</html>У цьому прикладі, щоб фонове зображення не обрізалося по верхньому краю, задана мінімальна висота блоку рівна 80 пікселям. Результат прикладу показано на рис. 1.
Мал. 1. Висота блоку, задана за допомогою min-height
Об'єктна модель
Об'єкт.style.minHeight
Специфікація
| Специфікація | Статус |
|---|---|
| CSS Intrinsic & Extrinsic Sizing Module Level 3 | Робочий проект |
| CSS Level 2 Revision 1 (CSS 2.1) | Рекомендація |
Специфікація
Кожна специфікація проходить кілька стадій схвалення.
- Recommendation (Рекомендація) — специфікація схвалена W3C і рекомендована як стандарт.
- Candidate Recommendation (Можлива рекомендація) — група, яка відповідає за стандарт, задоволена, як він відповідає своїм цілям, але потрібна допомога спільноти розробників з реалізації стандарту.) — на цьому етапі документ представлений на розгляд Консультативної ради W3C для остаточного затвердження. та внесення поправок для розгляду спільнотою.
- Editor's draft (Редакторська чернетка) — чорнова версія стандарту після внесення змін до редакторів проекту.
- Draft (Чернетка специфікації) — перша чорнова версія стандарту.
Браузери
| 7 | 12 | 1 | 7 | 1 | 1 |
| 1 | 1 | 7 | 1 |
Браузери
У таблиці браузерів застосовуються такі позначення.
- — властивість повністю підтримується браузером з усіма допустимими значеннями;
- > — властивість браузером не сприймається та ігнорується;
- — при роботі можлива поява різних помилок, або властивість підтримується лише частково, наприклад, не всі допустимі значення дейс чи властивість застосовується не до всіх елементів, які вказані в специфікації.
Число вказує версію браузера, починаючи з якої властивість підтримується.
"field field-name-field-css-cat field-type-taxonomy-term-reference field-label-hidden">