Препоръчителен метод с CSS & HTML
За отстъпване на текст или абзац най-често използваният и препоръчан метод е да се използва CSS. По-долу са дадени различни примери за това как CSS може да се използва за отстъп на текста. Всеки от тези примери ще бъде поставен между вашите HTML тагове.
Следващият пример ще създаде клас стил, наречен "tab", който отстъпва текста и параграф 40 пиксела отляво.
След като горният код е в секцията, можете да го използвате по всяко време, като го добавите към абзаца си (
) тагове, както е показано.
Пример за раздел
Включването на CSS във вашия HTML документ, както е показано по-горе, се нарича CSS "in-line". Той е полезен за бързото извършване на промени, но в дългосрочен план е трудно да се промени по-късно.
Вместо това можете да вземете целия си CSS код и да го поставите в отделен файл с разширение .css. След това можете да се свържете с този файл от всеки HTML документ и този документ да може да използва тези CSS свойства. Използването на външен CSS файл прави по-лесно промяната на CSS по-късно, защото всички CSS се дефинират на едно място.
За да се свържете с външния си CSS файл, добавете следния ред във вашия HTML документ в елемента (след
След като се създаде този .css файл, редактирайте файла и добавете същия CSS код, с изключение на маркерите и коментарите в него, както е показано.
.tab {margin-left: 40px; }
И накрая, след като горните стъпки приключат, можете да поставите всеки текст, използвайки същото
показан по-горе.
Има и други форми на отстъпване. Например, ако искате да отстъпите само първия ред на абзаца, вместо да използвате горната CSS линия, ще използвате следния ред.
.tab {text-indent: 40px}
Съвет: Можете също така да използвате отстъп с помощта на процент. Например, вместо отстъп от 40px (пиксела), можете да замените отстъп с 5% с отстъп на текста с 5% от текущия изглед. Можете също да използвате em пространство, когато определяте ширината на отстъп.
Бонусен съвет: Можете също да промените от ляво отстъп до дясно отстъп чрез промяна на марж-наляво към маржин-дясно.
Препоръчителен метод, използващ HTML
Възможно е да постигнете същите резултати по-горе, като използвате вграден стил в HTML. Докато използвате горния пример за CSS, можете да улесните поддържането на няколко уеб страници, ако трябва да използвате стил само след като можете да използвате следния пример.
Този текст е отстъпен.
В този първи пример целият текст в маркера на абзаца е с отстъп от 40 пиксела отляво. Всички други маркери на абзаци не са с отстъп.
Този текст е отстъпен.
В този втори пример само първия ред от текста в абзаца ще бъде вмъкнат 40 пиксела отляво. Допълнителните редове от текста в този параграф няма да бъдат отстъпвани.
Съвет: Можете също така да използвате отстъп с помощта на процент. Например, вместо отстъп от 40px (пиксела), можете да замените отстъп с 5% с отстъп на текста с 5% от текущия изглед. Можете също да използвате em пространство, когато определяте ширината на отстъп.
Бонусен съвет: Можете също да промените от ляво отстъп до дясно отстъп чрез промяна на марж-наляво към маржин-дясно.
Алтернативен метод
Друг често срещан (но неправилен) метод за вмъкване на текст е използването на маркерите, както е показано в следващия пример. Въпреки че това е много по-лесно решение, има проблеми с достъпността, които могат да бъдат причинени от използването на това решение за отстъпване на текста. Този етикет е предназначен за цитиране на текст, а не за отстъп.
Този текст ще бъде отстъпен