Най-често за определяне на размера на отстъпите в HTML-страниците се използват възможностите на езика CSS (Cascading Style Sheets). Въпреки че в самия език HTML има няколко "елементарни" остатъка, позволяващи в някои случаи да задават отстъп. По-долу са опциите, които се използват най-често, но освен тях все още има доста различни видове трикове, които ви позволяват да зададете отстъпи за нестандартно маркиране на HTML документи.
Необходимо е
Основни познания по езици HTML и CSS
Инструкции
Етап 1
Определете елемента на страницата, от който да отстъпите. Например, ако текстът е поставен вътре в маркера … (блок), тогава този блок ще бъде родителският елемент за този текст и отстъпът трябва да се брои от границите на блока. И ако текстът (или изображението) не е вътре в нито един блок (div, li и т.н.) или вградени (span, p и т.н.) елементи, тогава неговият родител ще бъде тялото на документа (маркера на тялото). Определянето на родителски елемент за текста е необходимо, тъй като той е този, който трябва да зададе описанията на стиловете, които формират отстъпите. Да приемем, че вашият текст е поставен в div блок: Примерен текст
Стъпка 2
Използвайте свойството CSS език margin, за да зададете полета, тоест разстоянието от границите на елемент до съседни елементи, както и до границите на родителския елемент. Това разстояние може да се зададе отделно за подложката от всяка страна: поле отгоре - отгоре, поле отдясно - отдясно, поле отдолу - отдолу, поле отляво - отляво. За горния пример този css код може да изглежда така: div {
margin-top: 10px;
поле вдясно: 15px;
margin-bottom: 40px;
поле вляво: 70px;
} Тук "div" е селектор, който указва, че този стил трябва да се прилага към всички div в кода на документа. Синтаксисът на CSS ви позволява да комбинирате всичките четири реда в един: div {
марж: 10px 15px 40px 70px;
} Стойностите на отстъпите винаги трябва да бъдат посочени в този ред: първо - отгоре, след това - отдясно, отдолу и отляво. Ако отстъпите са еднакви от всички страни, тогава е достатъчно да посочите стойността веднъж: div {
марж: 70px;
} Освен това можете да зададете плаващ хоризонтален поле (т.е. ляво и дясно). Това може да бъде много полезно, когато трябва да зададете блок с дадена ширина точно в центъра на прозореца на браузъра. Самият браузър автоматично определя колко отстъп трябва да бъде от двете страни, ако напишете следния CSS израз: div {
марж: 0 автоматично;
}
Стъпка 3
Използвайте свойството padding, за да зададете padding, което е разстоянието от границата на елемент до всички елементи, поставени вътре в него, включително текст. Синтаксисът за това свойство е абсолютно същият като за свойството margin: div {
подложка: 10px;
подложка вдясно: 15px;
подложка отдолу: 40px;
подложка вляво: 70px;
} Или div {
подплата: 10px 15px 40px 70px;
}
Стъпка 4
Използвайте свойството text-indent, за да зададете допълнителното отстъпване за първия ред на всеки абзац от текста. Например: div {
отстъп на текст: 80px;
}
Стъпка 5
Използвайте hspace и vspace атрибутите на HTML img маркера, за да зададете хоризонталното и вертикалното отстъп от изображението съответно на външните елементи. Например по този начин:
Стъпка 6
Използвайте атрибута cellpadding на тага на таблицата, ако трябва да зададете отстъп от границите на клетки в таблицата на тяхното съдържание. И атрибутът cellpacing задава разстоянието между клетките на таблицата. Например:
1 | 2 |