hanging-punctuation¶
Свойство hanging-punctuation
определяет как браузер будет отображать знаки пунктуации, попадающие в начало или в конец строки. Висячая пунктуация может располагаться за границами контейнера.
Текст
- letter-spacing
- text-decoration
- text-decoration-color
- text-decoration-line
- text-decoration-style
- text-decoration-thickness
- text-decoration-skip
- text-decoration-skip-ink
- text-emphasis
- text-emphasis-color
- text-emphasis-position
- text-emphasis-style
- text-indent
- text-rendering
- text-shadow
- text-underline-position
- text-transform
- white-space
- word-spacing
Синтаксис¶
/* Значения ключевых слов */
hanging-punctuation: none;
hanging-punctuation: first;
hanging-punctuation: last;
hanging-punctuation: force-end;
hanging-punctuation: allow-end;
/* Два ключевых слова */
hanging-punctuation: first force-end;
hanging-punctuation: first allow-end;
hanging-punctuation: first last;
hanging-punctuation: last force-end;
hanging-punctuation: last allow-end;
/* Три ключевых слова */
hanging-punctuation: first force-end last;
hanging-punctuation: first allow-end last;
/* Общие значения */
hanging-punctuation: inherit;
hanging-punctuation: initial;
hanging-punctuation: unset;
Значения¶
Значение по-умолчанию: none
Свойство hanging-punctuation
может быть определено с помощью одного, двух или трех ключевых слов.
Для одного значения может быть использовано любое из описанных ниже значений.
Для двух значений используются следующие варианты:
first
вместе с одним изlast
,allow-end
илиforce-end
last
вместе с одним изfirst
,allow-end
илиforce-end
Для трех значений используются один из следующих вариантов:
first
,allow-end
иlast
first
,force-end
иlast
none
- Никакие символы не выносятся.
first
- Открывающая скобка или кавычка в начале первой строки выровненного элемента будет вынесена.
last
- Закрывающая скобка или кавычка последней строки выровненного элемента будет вынесена.
force-end
- Точка или запятая в конце строки выносится.
allow-end
- Точка или запятая в конце строки будет вынесена, если нет лучшего варианта для выравнивания.
Спецификация¶
Поддержка браузерами¶
- Safari 10+
Пример¶
<p>
“Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Curabitur dignissim nunc mauris, et sollicitudin est
scelerisque sed. Praesent laoreet tortor massa, sit amet
vulputate nulla pharetra ut.”
</p>
p {
hanging-punctuation: first last;
margin: 0.5rem;
}
Ссылки¶
hanging-punctuation
MDN (рус.)