CSS : Selector activo
Ejemplo
Seleccione y aplique estilo al enlace activo:
a:active
{
background-color: yellow;
}
Más ejemplos de "Pruébelo usted mismo" a continuación.
Definición y uso
El :activeselector se utiliza para seleccionar y diseñar el enlace activo.
Un enlace se activa cuando haces clic en él.
Sugerencia: El selector :active se puede usar en todos los elementos, no solo en los enlaces.
Sugerencia: utilice el selector :link para diseñar enlaces a páginas no visitadas, el selector :visited para diseñar enlaces a páginas visitadas y el selector :hover para diseñar enlaces cuando pasa el mouse sobre ellos.
Nota: :active DEBE ir después de :hover (si está presente) en la definición de CSS para que sea efectivo.
| Versión: | CSS1 |
|---|
Compatibilidad con navegador
Los números de la tabla especifican la primera versión del navegador que es totalmente compatible con el selector.
| Selector | |||||
|---|---|---|---|---|---|
| :active | 4.0 | 7.0 | 2.0 | 3.1 | 9.6 |
Sintaxis CSS
:active {
css declarations;
}
Más ejemplos
Ejemplo
Seleccione y aplique estilo a un elemento <p>, <h1> y <a> cuando haga clic en él:
p:active, h1:active, a:active {
background-color: yellow;
}
Ejemplo
Seleccione y diseñe enlaces no visitados, visitados, flotantes y activos:
/* 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;
}
Ejemplo
Enlaces de estilo con diferentes estilos:
a.ex1:hover, a.ex1:active {
color: red;
}
a.ex2:hover, a.ex2:active {
font-size: 150%;
}
páginas relacionadas
Tutorial CSS: Enlaces CSS
Tutorial CSS: Pseudoclases CSS