Отступы на веб-странице


Горизонтальные и вертикальные отступы от края браузера до содержимого веб-странице встроены в браузер по умолчанию. Тем не менее можно изменять значение этих параметров, делая отступы по желанию больше или меньше. Хитрость заключается в том, что Internet Explorer и Netscape имеют разные параметры для указания значения отступов. У Internet Explorer в теге BODY следует указывать leftmargin для горизонтального отступа и topmargin для вертикального, а в Netscape те же функции выполняют параметры marginwidth и marginheight. Объединяя все параметры воедино, получим универсальный код, который будет работать во всех браузерах одинаково.

Пример 1. Изменение величины отступов
<body bgcolor="#FFFFFF" text="#000000" leftmargin="20" topmargin="20" marginwidth="20" marginheight="20">

Частенько отступы вообще убирают, делая их равными нулю. Тогда рабочее поле становится больше размером, а используемые рисунки и таблицы, выравненные по краю, располагаются «под обрез». Ниже приведен пример создания таблицы 100% ширины без пустого пространства между краем браузера и таблицой.

Пример 2. Отсутствие отступов на веб-странице
<body bgcolor="#FFFFFF" text="#000000" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">

<table width="100%" border="0" cellspacing="0" cellpadding="0" height="100">
<tr>
<td bgcolor="#CC6600">&nbsp;</td>
</tr>
</table>

</body>

Можно также изменять значения отступов с помощью стилей (пример 3). Для этого используются свойства margin и padding. Применение двух параметров вместо одного ликвидирует опять ту же печальную недоговоренность между браузерами. На этот раз конфликтуют между собой в вопросе об отступах браузеры Opera и Internet Explorer.

Пример 3. Отсутствие отступов на веб-странице
<html>
<head>
<style type="text/css">
BODY {
  margin: 0px;
  padding: 0px;
}
</style>
</head>
<body>

Нет никаких отступов!

</body>
</html>

Как показано в примере, отступы на веб-странице задаются через селектор BODY.




Предыдущая статья     Следующая статья     Список статей