CSS. Каскадные таблицы стилей. Подробное руководство.Символ-Плюс 2008 |
Страница 49 из 493 Аналогичным образом можно оформить только те элементы а, в кото-рых есть атрибут h ref. Также можно осуществлять выбор на основании наличия нескольких атрибутов. Это делается путем простого объединения селекторов атрибутов. Например, чтобы выделить полужирным шрифтом текст любой гиперссылки HTML, которая имеет и атрибут href, и атрибут title, можно написать: a[href][title] {font-weight:bold;} При этом полужирным шрифтом будет выделена первая ссылка следующей разметки, но не вторая нлн третья: <а href="http://www.w3.org/" title="W3C Home">W3C</a><br /> <а href="http://www.webstandards.org'^Standards Info</a><br /> <a title="Not a link">dead,letter</a> Выбор на основании конкретного значения атрибута В дополнение к выбору элементов по атрибутам можно еще более сузить выбор, чтобы охватить только те элементы, атрибуты которых имеют определенное значение. Например, пусть мы хотим выделить полужирным шрифтом гиперссылку, указывающую на определенный документ веб-сервера. Это могло бы выглядеть примерно так: a[href="http://www.css-discuss.org/about.html"] {font-weight:bold;} Для любого элемента может быть определено любое сочетание атрибута и значения. Однако если эта конкретная комбинация не встречается в документе, селектор не выберет ничего. И опять же языки XML могут выиграть от применения этого подхода для оформления. Вернемся к нашему примеру PlanetML. Предположим, требуется выбрать только те элементы planet, значение атрибута moons которых равно 1: planet[moons="1"] {font-weight:bold;} При этом полужирным шрифтом будет выделен текст второго элемента следующего фрагмента разметки, но не первого или третьего: <planet>Venus</planet> <planet moons="1">Earth</planet> <planet moons="2">Mars</planet> Как и в случае с выбором атрибутов, можно объединить несколько селекторов, чтобы выбрать один документ. Например, чтобы удвоить размер текста любой гиперссылки HTML, у которой атрибут href имеет значение http://www. w3. org/ и атрибут title имеет значение W3C Ноте, напишите: a[href="http://www.w3.org/"][title="W3C Home"] {font-size:200%;} При этом в приведенной ниже разметке будет увеличен размер текста первой ссылки, но не второй или третьей: |