Pseudoelementos en CSS3
Por Aitor López de Aberasturi el Lunes, 01 de Septiembre de 2014 0 Comentarios
A los pseudoelementos vamos a incorporar uno nuevo. En CSS3 para diferenciarlos de las pseudo-clases en lugar de utilizar un : (dos puntos) vamos a utilizar :: (dos puntos dos puntos).
::first-line: primera línea del texto del elemento. CSS1.
::first-letter: primera letra del texto del elemento. CSS1.
::after: Inserta contenido después del texto del elemento. CSS2.
::before: Inserta contenido después del texto del elemento. CSS2.
::selection: Selecciona un texto seleccionado por el usuario con el teclado o ratón. Solo se le puede aplicar a las propiedades color, background, cursor y outline. Firefox soporta uno alternativo ::-moz-selection. CSS3.
Ejemplo:
<!DOCTYPE html>
<html>
<head>
<style>
::selection
{
color:white;
background-color: blue;
}
::-moz-selection
{
color:white;
background-color: blue;
}
</style>
</head>
<body>
<h1>Selección de texto</h1>
<p>Selecciona el texto con el ratón o el teclado y verás como se pone con fondo azul.</p>
</body>
</html>