CSS: Selector de desplazamiento

Los datos expuestos en este blog, son solo de índole informativo. Por favor realiza siempre una copia de seguridad antes de realizar cualquier cambio en tu proyecto.

CSS: Selector de desplazamiento

Este tutorial de CSS explica cómo usar los selectores de CSS llamados : deambulando Con sintaxis y ejemplos.

describir

El selector CSS :hover le permite apuntar a los elementos sobre los que el usuario pasa el cursor o el puntero del mouse.

sintaxis

La sintaxis para el selector :active CSS es:

element:hover { style_properties }

parámetro o parámetro

elemento El elemento que se colocará cuando el usuario se desplace sobre él. style_properties Estilos CSS aplicados a los elementos cuando el usuario se desplaza sobre el elemento.

notas

Compatibilidad del navegador

El selector CSS :hover tiene soporte básico para los siguientes navegadores:

  • Aleación de cromo
  • Firefox (Geco)
  • Navegador de Internet (IE)
  • ópera
  • Safari (WebKit)

ejemplo

Discutiremos el selector :hover a continuación, explorando un ejemplo de cómo usar este selector en CSS para aplicar estilos a elementos flotantes.

con Etiqueta

Veamos un ejemplo de CSS :hover donde aplicamos el :hover selector a Etiqueta.

CSS se ve así:

a:hover { color: white; background: blue; }

HTML se ve así:

<div>
  <p>Here is a great site: <a href="https://www.checkyourmath.com/index.php">CheckYourMath.com</a></p>
</div>

Cuándo Cuando la etiqueta no se desplaza, se ve así:

Luego, una vez que pasas el cursor sobre etiqueta, el selector :hover será El marcador tiene el siguiente estilo:

En este ejemplo de :hover, el enlace “CheckYourMath.com” solo aparece como texto blanco con fondo azul cuando se pasa el cursor o el puntero del mouse.

con

Etiqueta

Veamos un ejemplo de CSS :hover donde aplicamos el :hover selector a

Etiqueta.

CSS se ve así:

div:hover { background: yellow; }

HTML se ve así:

<div>
  <p>TechOnTheNet.com has been providing helpful references, how-to's and FAQs since 2003. We focus on technologies such as Microsoft Access, Microsoft Excel, Microsoft Word, SQL, Oracle/PLSQL, MySQL, HTML, CSS, and the C Language.</p>
</div>
<div>
  <p>The information presented here is suitable for all programmers from beginner to expert. We hope you find this information useful and return to our site, as we expand our information base.</p>
</div>

Cuándo

Cuando la etiqueta no se desplaza, se ve así:

Luego, una vez que pasas el cursor sobre

en una de las etiquetas, el selector :hover establecerá

El estilo del marcador, de la siguiente manera:

En este ejemplo de :hover, nos desplazamos sobre el segundo

etiqueta, esto hace que el selector :hover

el estilo se establece en un fondo amarillo.

(Visited 8 times, 1 visits today)