Атрибут topmargin тега <body> — відступ згори сторінки
автор: с3с
Загальний опис
автор: NagarD
- Порада
-
Браузер Firefox не розуміє атрибут
topmargin, для установки відступів в ньому використовуютьсяmarginwidth- відступи по горизонталі іmarginheight- відступи по вертикалі.Щоб задати відступи на сторінці через стилі, використовуйте стильову властивість
автор: с3сmargin, застосовуючи його до селектораbody.
Синтаксис
<body topmargin="pixels">Атрибут topmargin може отримувати єдине значення:
-
pixels -
Кількість пікселів для відступу (10 пікселів без задання).
автор: с3с
Переглядачі
| Переглядач |  |
 |
 |
 |
 |
 |
|---|---|---|---|---|---|---|
| 1 | 35 | ≤4 | 15 | 79 | — |
| Переглядач |  |
 |
 |
 |
|---|---|---|---|---|
| 4.4 | 18 | 35 | ≤3.2 |
Приклади
+ запропонувати свій приклад у пісочниці
Угорі — таблиця того, що насправді роблять чотири «поля тіла»: два з них задають по дві сторони одразу, а два не роблять нічого. Нижче — живі коробки, на яких видно різницю між типовим полем 8px, полем, заданим із обох боків одразу, і сучасним записом, де кожна сторона своя. Наприкінці — старий рядок розмітки, наведений текстом.
HTML
<table class="dovidka">
<caption>Що насправді роблять «поля тіла»</caption>
<thead>
<tr><th scope="col">Атрибут</th><th scope="col">Що задає насправді</th></tr>
</thead>
<tbody>
<tr><th scope="row">topmargin="40"</th><td class="ok">margin-top ТА margin-bottom</td></tr>
<tr><th scope="row">leftmargin="30"</th><td class="ok">margin-left ТА margin-right</td></tr>
<tr><th scope="row">bottommargin="40"</th><td class="ni">нічого</td></tr>
<tr><th scope="row">rightmargin="30"</th><td class="ni">нічого</td></tr>
<tr><th scope="row">marginheight="35"</th><td class="ok">обидва вертикальні, ще й виграє в topmargin</td></tr>
</tbody>
</table>
<p class="head">Типове поле тіла — 8px з усіх боків</p>
<div class="vikno"><div class="tilo typove">вміст</div></div>
<p class="head">Те, що дає topmargin="40": по 40px згори й знизу</p>
<div class="vikno"><div class="tilo obydva">вміст</div></div>
<p class="head">Те, чого атрибутами не досягти: лише згори</p>
<div class="vikno"><div class="tilo lyshe-zhory">вміст</div></div>
<pre class="kod"><body topmargin="40" leftmargin="30" bottommargin="10">
body { margin: 40px 30px 10px; } /* те саме, тільки справді працює */</pre>CSS
.head {
margin: 20px 0 6px;
color: #5a6472;
font: 600 14px/1.4 system-ui, sans-serif;
text-transform: uppercase;
letter-spacing: .04em;
}
.dovidka {
width: 100%;
max-width: 480px;
margin-bottom: 10px;
border-collapse: collapse;
}
.dovidka caption {
margin-bottom: 6px;
font-weight: 600;
text-align: left;
}
.dovidka td,
.dovidka th {
padding: 5px 10px;
border: 1px solid #b9c6d8;
text-align: left;
}
.dovidka thead th {
background: #eef3fb;
}
.dovidka th[scope="row"] {
font: 14px/1.5 ui-monospace, monospace;
font-weight: 400;
}
.ok {
background: #f3fbf4;
color: #1b5e20;
}
.ni {
background: #fff4f4;
color: #c0392b;
}
/* «Вікно» — щоб було видно, від чого міряються поля. */
.vikno {
max-width: 300px;
background: #d64545;
border-radius: 4px;
}
.tilo {
background: #ffffff;
padding: 6px 8px;
font-size: .9em;
}
.typove {
margin: 8px;
}
.obydva {
margin: 40px 8px;
}
.lyshe-zhory {
margin: 40px 8px 8px;
}
.kod {
max-width: 480px;
margin-top: 20px;
padding: 8px 10px;
overflow-x: auto;
border: 1px solid #b9c6d8;
border-radius: 6px;
background: #f6f9ff;
font: 14px/1.6 ui-monospace, monospace;
}Найпростіший приклад використання атрибуту topmargin тегу body
<body topmargin="200">
<p>Приклад використання атрибуту topmargin</p>
<p >"Body" застосовується для визначення кольорів посилань і тексту на веб-сторінці. Подібна практика в HTML засуджується і натомість для вказівки колірної схеми рекомендується використовувати стилі, застосовуючи їх до селектору body.</p>Найпростіший приклад використання атрибуту topmargin тегу body
HTML
<body id="im">
<div class="head1">
<p>У цьому прикладі, Ви можете змінювати значення для властивості topmargin в межах від 0 до 200 переміщаючи повзунок.</p>
<p id="text"></p>
<input type="range" min="0" max="200" step="1" value="0" id="range" onmousemove="f()">
</div>
<p >"Body" застосовується для визначення кольорів посилань і тексту на веб-сторінці. Подібна практика в HTML засуджується і натомість для вказівки колірної схеми рекомендується використовувати стилі, застосовуючи їх до селектору body.</p>CSS
.blok{
display:blok;
float:left;
border:1px solid ;
padding:20px;
}
.head1{
text-align:center;
}Різниця між HTML 4.01 та HTML5
Атрибут topmargin тегу <body> не підтримується у HTML5.
Коментарі
Коментарів ще немає — будьте першим!