Паузы

Все разговорные языки основаны на различных паузах. Короткие промежутки между словами, фразами и предложениями настолько же важны для понимания значения, как и сами слова. Паузы представляют собой звуковые эквиваленты полей в том смысле, что и те и другие служат для отделения элемента от окружающего его содержимого. В CSS для введения пауз в документ могут применяться три свойства:

pause-before, pause-after и pause.

Формат <время> позволяет задать длительность паузы в секундах или миллисекундах. Допустим, требуется вставить полную двухсекундную паузу после элемента h1. Это можно обеспечить любым из двух следующих правил:

h1 {pause-after: 2s;}
h1 {pause-after: 2000ms;} /* продолжительность, аналогичная '2s' */

С процентными значениями все немного сложнее, поскольку они вычисляются относительно заданного значения speech-rate. Давайте посмотрим, как это происходит. Во-первых, рассмотрим следующее:

h1 {speech-rate: 180;}

Это значит, что любой элемент h1 будет воспроизводиться со скоростью примерно три слова в секунду. Теперь рассмотрим:

h1 {speech-rate: 180; pause-before: 200%;}

Это процентное значение вычисляется на основании средней длины слова.


В данном случае произнесение одного слова занимает 333,33 миллисекунды, так что 200% от этого значения составляет 666,66 миллисекунды. Скажем по-другому: каждому h1 будут предшествовать паузы продолжительностью в две трети секунды. Если изменить правило так, что значение speech-rate будет равно 120, пауза будет длиться целую секунду.
Свойство pause – это сокращенная форма записи, которая объединяет pause-before и pause-after.

Если задается только одно значение, оно определяет продолжительность паузы и перед элементом, и после него. Если указывается два значения, тогда первое определяет паузу перед элементом, а второе – паузу после него. Таким образом, следующие правила эквивалентны:

pre {pause: 1s;}
pre {pause: 1s 1s;}
pre {pause-before: 1s; pause-after: 1s;}

Оцените статью: (0 голосов)
0 5 0

Статьи из раздела CSS на эту тему:
Воспроизведение речи
Выбор типов страниц
Звуковое воспроизведение заголовков таблиц
Звуковое сопровождение
Изменение высоты

Вернуться в раздел: CSS / 14. Неэкранные устройства