Как да зададете отстъп

Съдържание:

Как да зададете отстъп
Как да зададете отстъп

Видео: Как да зададете отстъп

Видео: Как да зададете отстъп
Видео: Excel: Диагональное разделение ячейки (два заголовка в одной ячейке) 2024, Може
Anonim

Най-често за определяне на размера на отстъпите в 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

Препоръчано: