Як зробити відступ.

Найчастіше для вказівки розмірів відступів в HTML-сторінках використовують можливості мови CSS (Cascading Style Sheets - «Каскадні таблиці стилів»). Хоча і в самій мові HTML є кілька «рудиментарних» залишків, що дозволяють в деяких випадках задавати відступи. Нижче наведені варіанти, які використовуються найбільш часто, але крім них є ще досить багато різного роду вивертів, які дозволяють задавати відступи при нестандартної розмітці HTML-документів.
Вам знадобиться
  • Базові знання мов HTML і CSS
Інструкція
1
Визначте елемент сторінки, від якого слід відраховувати відступ. Наприклад, якщо текст поміщений всередину тега
... (блок), то батьківським елементом для цього тексту буде цей блок і відраховувати відступ потрібно від кордонів блоку. А якщо текст (або зображення) не знаходиться всередині будь-яких блочних (div, li і т.д.) або рядкових (span, p і т.д.) елементів, то його батьком буде тіло документа (тег body). Визначити батьківський елемент для тексту необхідно тому, що саме йому треба задавати опису стилів, що формують відступи. Будемо вважати, що текст у вас поміщений всередину блоку div:
Зразок тексту
2
Використовуйте властивість margin мови CSS, щоб задати зовнішні відступи, тобто відстань від кордонів елемента до сусідніх елементів, а також до кордонів батьківського елементу. Цю відстань можна задавати окремо для відступу з кожного боку: margin-top - зверху, margin-right - праворуч, margin-bottom - знизу, margin-left - зліва. Для зразка, наведеного вище такий css-код може виглядати, наприклад, так: div {margin-top: 10px; margin-right: 15px; margin-bottom: 40px; margin-left: 70px;} Тут «div» - це селектор, який вказує, що цей стиль треба застосовувати до всіх тегам div в коді документа.Сінтаксіс CSS дозволяє об'єднати всі чотири рядки в одну: div {margin: 10px 15px 40px 70px; } Значення відступів завжди треба вказувати саме в такому порядку: спочатку - зверху, потім - праворуч, знизу і слева.Еслі відступи однакові з усіх боків, то досить вказати значення один раз: div {margin: 70px; } Крім того, можна задати плаваючий зовнішній відступ по горизонталі (тобто ліворуч і праворуч). Це буває дуже корисно, коли треба встановити блок заданої ширини точно по центру вікна браузера. Браузер сам автоматично визначає яким повинен бути відступ з обох сторін, якщо написати таку CSS-інструкцію: div {margin: 0 auto;}
3
Використовуйте властивість padding, щоб задати внутрішні відступи, тобто відстань від кордонів елемента до будь-яких поміщених усередину нього елементів, включаючи текст. Синтаксис написання у цього властивості точно такий же, як і у властивості margin: div {padding-top: 10px; padding-right: 15px; padding-bottom: 40px; padding-left: 70px;} Іліdiv {padding: 10px 15px 40px 70px;}
4
Використовуйте властивість text-indent, щоб задати додатковий відступ для першого рядка кожного абзацу тексту. Наприклад: div {text-indent: 80px;}
5
Використовуйте атрибути hspace і vspace HTML-тега img, щоб задати, відповідно, горизонтальний і вертикальний відступ від картинки до зовнішніх елементів. Наприклад, так:
6
Використовуйте атрибут cellpadding тега table, якщо потрібно задати відступ від кордонів осередків у таблиці до їх вмісту. А атрибут cellspacing задає відступ між осередками таблиці. Наприклад:
1 2