Язык текста.

Псевдокласс lang определяет язык текста того или иного элемента или документа в целом.

Если Вы помните из курса HTML, язык документа определяют атрибуты: charset - кодировка документа и content - язык документа (http://webremeslo.ru/html/glava10.html#charset) для тега <meta>.

<meta http-equiv="Content-Type" Content="text/html; Charset=Windows-1251">
<meta http-equiv="Content-Language" Content="ru">

Так вот для того чтобы определить язык отдельно взятого текстового блока используют псевдокласс lang() - в круглых скобках которого собственно и указывается язык.

Язык может быть:

· ru - Русский

· en - Английский

· de - Немецкий

· fr - Французский

· it - Итальянский

Всё вместе пишется так:

span:lang(en) {font-style: italic}

- здесь мы указали, что текст взятый в контейнер <span> английский и что он должен отображаться курсивом.

Пример:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Псевдокласс lang</title>
<meta http-equiv="Content-Type" Content="text/html; Charset=Windows-1251">
<meta http-equiv="Content-Language" Content="ru">
<style type="text/css">
p:lang(ru) {color: #00f;}
p:lang(en) {color: #f00;}
</style>
</head>
<body>
<p lang="ru">Русский текст выделен синим</p>
<p lang="en">English text is chosen red</p>
</body>
</html>

Обратите внимание, что в теге, в нашем случая параграфе, мы указываем с помощью атрибута lang используемый язык и его стиль: <p lang="en">текст</p> прописанный в блоке CSS.

Так же псевдокласс lang позволяет определять вид кавычек для цитат (тег <q>) с помощью значения quotes - кавычки. В России привычно использовать двойные кавычки, в других странах дела обстоят иначе.

Пишется так:

q:lang(en) {quotes: "\201C" "\201D"}

В фигурных скобках после значения quotes указывается юникод символа/ов или просто смвол/ы для открывающей и закрывающей кавычки.

Пример:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Псевдокласс lang. Цитаты.</title>
<meta http-equiv="Content-Type" Content="text/html; Charset=Windows-1251">
<meta http-equiv="Content-Language" Content="ru">
<style type="text/css">
div {
color:#000;
font-size: 24px;
}
q:lang(en) {quotes: "\201C" "\201D"}
q:lang(de) {quotes: "\201E" "\201C"}
q:lang(fr) {quotes: "\00AB" "\00BB"}
q:lang(ru) {quotes: "ёклмн.." "..ёпрст"}
</style>
</head>
<body>
<div>
<p>Обратите внимание на вид кавычек для цитат:<p>
<q>Цитата по умолчанию</q><br>
<q lang="fr">Французская цитата</q><br>
<q lang="de">Немецкая цитата</q><br>
<q lang="en">Английская цитата</q><br>
<q lang="ru">Русская цитата</q><br>
</div>
</body>
</html>

Полезные советы:

· Псевдоклассы нельзя внедрять в HTML документ с помощью атрибута style. Можно только с помощью тега <style> в голове документа или внешнего CSS файла.

· Если селектор, какого либо псевдокласса, явно не указывать, а написать вот так, например:

:hover {color: #ff0}

- то это будет значить, что действие данного псевдокласса будет распространятся на все элементы документа.

· Браузер IE6 и ниже игнорирует практически все псевдоклассы.