Атрибут rows тега <frameset> — поділ вікна на рядки
автор: NagarD
Загальний опис
автор: NagarD
- Порада
-
Число значеннь атрибут row визначає кількість рядків в
автор: Wsewlad<frameset>.
Синтаксис
<frameset rows="pixels|%|*">
Атрибут rows може отримувати 3 значень:
-
pixels -
Розмір рядка в пікселях (наприклад, "100px" або просто "100")
автор: NagarD -
% -
Розмір рядка в відсотках від загального обсягу простору (наприклад, "50%")
автор: NagarD -
* -
Вся інша частина вільного простору повинна бути призначена цьому рядку
автор: NagarD
Переглядачі
| Переглядач | ||||||
|---|---|---|---|---|---|---|
| 1 | 1 | 3 | 15 | 12 | ≤11 |
| Переглядач | ||||
|---|---|---|---|---|
| 4.4 | 18 | 4 | 2 |
Приклади
+ запропонувати свій приклад у пісочниці
Фрейми в рамці прикладу показати неможливо, тому три набори rows відтворено їхнім точним сучасним відповідником — grid-template-rows. Значення переписані один в один: пікселі лишаються пікселями, відсотки — відсотками, а зірочка стає 1fr.
HTML
<p>1. rows="80,*,15%" — це grid-template-rows: 80px 1fr 15%</p>
<div class="win a">
<div class="f">80 пікселів — фіксована шапка</div>
<div class="f">зірочка: увесь залишок</div>
<div class="f">15% висоти вікна</div>
</div>
<p>2. rows="1*,2*,3*" — це grid-template-rows: 1fr 2fr 3fr</p>
<div class="win b">
<div class="f">1fr</div>
<div class="f">2fr — удвічі більше</div>
<div class="f">3fr — утричі більше</div>
</div>
<p>3. rows="50%,50%,50%" — сума 150%, і браузер нормалізує частки: три
однакові смуги по третині, без жодної помилки</p>
<div class="win c">
<div class="f">третина</div>
<div class="f">третина</div>
<div class="f">третина</div>
</div>
CSS
p {
max-width: 520px;
margin: 16px 0 6px;
}
.win {
display: grid;
gap: 2px;
width: 320px;
height: 300px;
padding: 2px;
border: 2px solid #b9c6d8;
background: #b9c6d8;
}
.a {
grid-template-rows: 80px 1fr 15%;
}
.b {
grid-template-rows: 1fr 2fr 3fr;
}
.c {
grid-template-rows: 1fr 1fr 1fr;
}
.f {
padding: 4px 8px;
background: #f6f9ff;
color: #1b4f9c;
font-size: .9em;
}
rows="25%,*,25%" ділить вікно на три горизонтальні смуги: чверть, решта (зірочка) і ще чверть. Фрейми вилучено з HTML5 — демо працює завдяки сумісності браузерів.
<!DOCTYPE html>
<html>
<frameset rows="25%,*,25%">
<frame src="data:text/html;charset=utf-8,%3Cbody style='background:%23eef6ff'%3E25%25%3C/body%3E">
<frame src="data:text/html;charset=utf-8,%3Cbody%3E%D1%81%D0%B5%D1%80%D0%B5%D0%B4%D0%B8%D0%BD%D0%B0 — *%3C/body%3E">
<frame src="data:text/html;charset=utf-8,%3Cbody style='background:%23ffef9e'%3E25%25%3C/body%3E">
</frameset>
</html>
Різниця між HTML 4.01 та HTML5
Атрибут rows для тегу <frameset> не підтримується у HTML5.
Коментарі
Коментарів ще немає — будьте першим!