CSS : активный селектор
Пример
Выберите и настройте активную ссылку:
a:active
{
background-color: yellow;
}
Другие примеры «Попробуйте сами» ниже.
Определение и использование
Селектор :active
используется для выбора и оформления активной ссылки.
Ссылка становится активной при нажатии на нее.
Совет : селектор :active можно использовать для всех элементов, а не только для ссылок.
Совет. Используйте селектор :link для стилизации ссылок на непосещенные страницы, селектор :visited для стилизации ссылок на посещенные страницы и селектор :hover для оформления ссылок при наведении на них указателя мыши.
Примечание: :active ДОЛЖНО идти после :hover (если присутствует) в определении CSS, чтобы быть эффективным!
Версия: | CSS1 |
---|
Поддержка браузера
Цифры в таблице указывают на первую версию браузера, которая полностью поддерживает селектор.
Selector | |||||
---|---|---|---|---|---|
:active | 4.0 | 7.0 | 2.0 | 3.1 | 9.6 |
Синтаксис CSS
:active {
css declarations;
}
Дополнительные примеры
Пример
Выберите и стилизуйте элемент <p>, <h1> и <a> при нажатии на него:
p:active, h1:active, a:active {
background-color: yellow;
}
Пример
Выберите и стилизуйте непосещенные, посещенные, наведенные и активные ссылки:
/* unvisited link */
a:link {
color: green;
}
/* visited link */
a:visited {
color: green;
}
/* mouse over link */
a:hover {
color: red;
}
/* selected link */
a:active {
color: yellow;
}
Пример
Ссылки на стили с разными стилями:
a.ex1:hover, a.ex1:active {
color: red;
}
a.ex2:hover, a.ex2:active {
font-size: 150%;
}
Связанные страницы
Учебное пособие по CSS: CSS-ссылки
Учебное пособие по CSS: псевдоклассы CSS