¿Qué es un selector? ¿Contenido en html?
El selector seleccionará elementos en el archivo HTML que coincidan con el contenido del selector y agregará los estilos correspondientes. Mire el código:
& lt! DOCTYPE html & gt
& lthtml & gt
& lthead & gt
& ltmeta charset="UTF-8 "
& lttitle & gt& lt/title & gt;
& ltstyle & gt
/*selector de etiquetas*/
span{
Color: rojo; familia de fuentes: escritura china; tamaño de fuente: 36px
}
/*id selector*/
#Segundo lugar{< /p >
Fondo:oro;
}
/*Selector de clase*/
. Poesía
Decoración del texto: subrayado;
}
& lt/style & gt;
& lt/head & gt;
& ltbody & gt
& ltspan & gtLas montañas bloquearon el sol blanco. ?
& ltspan id="segundo " >El océano drenaba el río dorado. ?
& ltspan class= "Poesía" >Pero has ampliado tus horizontes en trescientas millas. ?
& ltspan & gtSube un tramo de escaleras. ?
& lt/body & gt;
& lt/html & gt;
Nota: Los espacios se utilizan en HTML para separar poemas para facilitar la lectura. El efecto es el siguiente:
La función del selector de etiquetas es agregar estilos a todas las etiquetas que coinciden con el selector. Aquí modificamos el color de fuente, el tamaño y el estilo de caligrafía. Debido a que las cuatro notas son etiquetas de extensión, todas se seleccionan para su modificación;
El selector de identificación seleccionará el elemento cuyo valor de atributo de la etiqueta de identificación en el archivo HTML coincida con el selector de identificación y agregará un estilo para ello. Para estandarizar el formato, estipulamos que no se permite repetir el valor del atributo id. Aquí configuramos el color de fondo en amarillo y el selector de identificación solo coincide con la segunda sección, por lo que simplemente le agregamos un estilo.
El selector de clase agregará estilos a los elementos en el archivo HTML cuyos atributos de etiqueta de clase tengan valores de atributo que coincidan con el selector de clase; aquí configuramos el estilo para subrayar solo el atributo de clase de la tercera sección; El valor coincide, por lo que solo está subrayado;
Selector de descendientes
Selector de paquetes
Selector de comodines
& lt! DOCTYPE html & gt
& lthtml & gt
& lthead & gt
& ltmeta charset="UTF-8 "
& lttitle & gt& lt/title & gt;
& ltstyle & gt
/*selector de descendientes*/
extensión del cuerpo html{
Estilo de fuente: cursiva;
}
/*Cada etiqueta del selector de grupo