Кавычки
Кавычки
Может понадобиться, чтобы в документе или в какой-то его части кавычки отображались не так, как обычно, а в зависимости от стиля и содержимого. С помощью CSS вы можете определять, каким образом браузер будет отображать кавычки. Свойство quotes задает пару «» для каждого уровня вложенности цитат, а свойство content предоставляет доступ к этим кавычкам и вставляет их до и после цитаты.
Рассмотрим определения кавычек с помощью свойства quotes. Лучше всего это можно понять из примера. Попробуйте применить следующую таблицу стиля:
/* Определение пар кавычек для двух уровней в двух языках */
Q:lang(ru) { quotes: ‘"’ ‘"’ "’" "’" }
Q:lang(no) { quotes: "«" "»" "<" ">" }
/* Вставка кавычек до и после содержимого элемента Q */
Q:before { content: open-quote }
Q:after { content: close-quote }
к HTML-документу, представленному в листинге 9.2.
Листинг 9.2. Кавычки
<html>
<head>
<title>Глава 9</title>
</head>
<body>
<p><q>Этот текст выделен кавычками.</q>
</body>
</html>
В результате его обработки браузером вы получите такой текст:
«Этот текст выделен кавычками.»
Если ту же таблицу стилей применить к HTML-документу, приведенному в листинге 9.3, то получим такую строку:
«Trondere gra?ter na?r <Vinsjan pa? kaia> blir deklamert.»
Листинг 9.3. Кавычки
<html>
<head>
<title>Глава 9</title>
</head>
<body>
<p><q>Trondere gra?ter na?r <q>Vinsjan pa? kaia</q> blir deklamert.</q>
</body>
</html>
Как вы, наверное, заметили из примера, кавычки вставляются в соответствующие места документа благодаря значениям open-quote и close-quote, принимаемым свойством content. Каждое вхождение open-quote или close-quote в зависимости от глубины вложения заменяется одной из строк, принадлежащих значению свойства quotes.
Open-quote указывает на первую из двух кавычек, а close-quote – на вторую. Тип используемых кавычек зависит от уровня их вложенности.
Вы также можете задавать кавычки, используя один из шестнадцатеричных кодов, приведенных в табл. 9.1, предварительно поставив знак .
Таблица 9.1. Кавычки
Например:
quotes: """ """ «2039» «203A»
Данный текст является ознакомительным фрагментом.