W3docs

Свойство CSS hanging-punctuation

Use the CSS hanging-punctuation property to define whether a punctuation mark should hang at the start or at the end of a text’s line. Definition of the property, values and examples.

Свойство hanging-punctuation определяет, должен ли знак препинания выступать за пределы начала или конца строки текста.

Висячая пунктуация используется с полностью выровненным текстом и управляет выравниванием всех строк в абзаце при применении к концу строк.

Начальное значениеnone
Применяется кВсем элементам.
НаследуетсяДа.
АнимацияНет.
ВерсияCSS3
Синтаксис DOMobject.style.hangingPunctuation = "last";

Синтаксис

Синтаксис свойства CSS hanging-punctuation

hanging-punctuation: none | first | last | allow-end | force-end | initial | inherit;

Пример свойства hanging-punctuation:

Пример использования свойства CSS hanging-punctuation со значением first

<!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>

Результат

Свойство CSS hanging-punctuation

Значения

ЗначениеОписание
noneВисячая пунктуация не применяется. Это значение по умолчанию для данного свойства.
firstЗнак препинания будет выступать за пределы начального края первой строки.
lastЗнак препинания будет выступать за пределы конечного края последней строки.
allow-endЗнак препинания будет выступать за пределы конечного края строки, если он не помещается до выравнивания.
force-endЗнак препинания будет выступать за пределы конечного края всех строк. Если для строки включено выравнивание, это заставит знак препинания выступать.

Практика

Практика

Что делает свойство висячей пунктуации в CSS?