На text-indent
уточнява собственост колко хоризонтално пространство текста трябва да бъдат преместени преди началото на първия ред на текстовото съдържание на елемент. Разстоянието се изчислява от началния ръб на елемента контейнер на ниво блок.
Началният ръб обикновено е отляво, но може да е и отдясно, ако е в режим отдясно наляво, ала посоката.
В text-indent
имота се наследява, когато са предвидени за блоков елемент, което означава, че ще се отрази на инлайн блокови потомък елементи. Когато се занимавате с деца с вградени блокове, може да искате да ги принудите text-indent: 0;
.
Синтаксис
text-indent: | | inherit && ( hanging || each-line ) p ( text-indent: 1.5em; )
Често използваният случай би бил просто стилистичен. Отстъпът на първия ред на абзаците е някак старомоден и може да предизвика това усещане. Може да се използва вместо разстояния след абзаци като алтернативен визуален индикатор, въпреки че разстоянието вероятно е по-четливо като цяло.
Друг често срещан случай е „заместване на изображение“, където текстът се изхвърля от елемента чрез отстъп на текст и скрито преливане.
обесване
hanging
е експериментална и неофициална стойност за text-indent
имота. Той обръща кои линии са с отстъпи. По принцип отстъпва всеки ред с изключение на първия, което води до някаква висяща пунктуация.
Тази стойност е флаг, заедно с обща стойност като дължина.
всеки ред
each-line
е експериментална и неофициална стойност за text-indent
имота. Идеята е да се отстъпи всеки ред след принудително прекъсване на линия (с a
).
Тази стойност е флаг, заедно с обща стойност като дължина.
Демонстрация
Вижте текстовия отстъп на Pen от Chris Coyier (@chriscoyier) на CodePen.
Поддръжка на браузър
Основна поддръжка
Chrome | Сафари | Firefox | Опера | IE | Android | iOS |
---|---|---|---|---|---|---|
всякакви | всякакви | всякакви | 3,5+ | 3+ | всякакви | всякакви |
висяща стойност
Chrome | Сафари | Firefox | Опера | IE | Android | iOS |
---|---|---|---|---|---|---|
нито един | нито един | нито един | нито един | нито един | нито един | нито един |
стойност на всеки ред
Chrome | Сафари | Firefox | Опера | IE | Android | iOS |
---|---|---|---|---|---|---|
нито един | нито един | нито един | нито един | нито един | нито един | нито един |