css властивість hanging-punctuation


CSS властивість hanging-punctuation спрямована на надання веб-дизайнерам більш тонкого контролю над типографікою в Інтернеті.

На кожному краю рядка, може розміщуватися лише один розділовий знак.

Відоме як оптичне вирівнювання, цей прийом може зробити текст більш читабельним, так як кожний рядок у тексті вирівнюється відносно попереднього, незалежно від того, чи має той розділові знаки, чи ні.

Синтаксис властивості:

hanging-punctuation: none | [ first || [ force-end | allow-end ] || last ]



blockquote p {

  hanging-punctuation: first;

}

Доступні символи

Code Character Name
U+002C , COMMA
U+002E . FULL STOP
U+060C ، ARABIC COMMA
U+06D4 ۔ ARABIC FULL STOP
U+3001 IDEOGRAPHIC COMMA
U+3002 IDEOGRAPHIC FULL STOP
U+FF0C FULLWIDTH COMMA
U+FF0E FULLWIDTH FULL STOP
U+FE50 SMALL COMMA
U+FE51 SMALL IDEOGRAPHIC COMMA
U+FE52 SMALL FULL STOP
U+FF61 HALFWIDTH IDEOGRAPHIC FULL STOP
U+FF64 HALFWIDTH IDEOGRAPHIC COMMA
Нотатка:

Наразі властивість hanging-punctuation не працює в жодному браузері, й можливо буде виключена із специфікації CSS.

Синтаксис

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

Властивість hanging-punctuation може отримувати 7 значень:

none

Розділові знаки не можуть бути розміщені за межами rонтейнера. Без задання.

first

Розділові знаки можуть розміщуватися за межами початкового краю першого рядка.

last

Розділові знаки можуть розміщуватися за межами останнього рядка контейнера.

allow-end

Якщо розділові знаки не поміщаються в контейнері, вони можуть бути розміщені за межами рядка.

force-end

Розділові знаки можуть розміщуватися за межами контейнера.

initial

Встановлює цю властивість в значення без задання.

inherit

Успадкує значення властивості від свого батьківського елемента.

Значення без задання: none
Наслідує: Так
Анімується: Ні
JavaScript синтаксис: object.style.hangingPunctuation="first"

Переглядачі

Переглядач
hanging-punctuation

10.0

Не підтримується

Не підтримується

Не підтримується

Не підтримується

Переглядач
hanging-punctuation

Не підтримується

Не підтримується

Не підтримується


Мобільних переглядачів ще не додано.

Приклади


Застовування властивості

p {


    hanging-punctuation: first;


}

Застовування властивості

blockquote p {


  hanging-punctuation: last;


}

Додаткові посилання