Свойство CSS hanging-punctuation
Свойство hanging-punctuation определяет, должен ли знак препинания выступать за пределы начала или конца строки текста.
Висячая пунктуация используется с полностью выровненным текстом и управляет выравниванием всех строк в абзаце при применении к концу строк.
| Начальное значение | none |
|---|---|
| Применяется к | Всем элементам. |
| Наследуется | Да. |
| Анимация | Нет. |
| Версия | CSS3 |
| Синтаксис DOM | object.style.hangingPunctuation = "last"; |
Синтаксис
Синтаксис свойства CSS hanging-punctuation
css
hanging-punctuation: none | first | last | allow-end | force-end | initial | inherit;Пример свойства hanging-punctuation:
Пример использования свойства CSS hanging-punctuation со значением first
html
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
<style>
blockquote {
font-style: normal;
font-size: 25px;
width: 20em;
border-left: 1px solid #000;
padding: 3rem 0;
hanging-punctuation: first;
}
</style>
</head>
<body>
<h2>Hanging-punctuation property example</h2>
<blockquote>"Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s".</blockquote>
</body>
</html>Результат
Значения
| Значение | Описание |
|---|---|
| none | Висячая пунктуация не применяется. Это значение по умолчанию для данного свойства. |
| first | Знак препинания будет выступать за пределы начального края первой строки. |
| last | Знак препинания будет выступать за пределы конечного края последней строки. |
| allow-end | Знак препинания будет выступать за пределы конечного края строки, если он не помещается до выравнивания. |
| force-end | Знак препинания будет выступать за пределы конечного края всех строк. Если для строки включено выравнивание, это заставит знак препинания выступать. |
Практика
Что делает свойство висячей пунктуации в CSS?