Serialización detallada de HTML (5)

enlace de columnaenlace

La siguiente columna presenta

Esta columna es el viaje de aprender el front-end por mí mismo, el código es puramente golpeado a mano, y seguí el curso del caballo oscuro para aprender, y agregué algunos de mis propios conocimientos e hice los cambios apropiados en el código y las notas
. Espero que pueda ser útil para todos y, al mismo tiempo, supervíseme, dé sugerencias sobre el código que escribí y aprendan unos de otros.

comenzar

inserte la descripción de la imagen aquí

Altura de línea: establezca el espaciado del texto de varias líneas

Nombre del Atributo

altura de la línea

valor de atributo

Número +
número px (el múltiplo del valor del atributo de tamaño de fuente de la etiqueta actual)

Método de medición de altura de fila

Mida desde la parte superior (inferior) de una línea de texto hasta la parte superior (inferior) de la siguiente línea de texto

Altura de fila: centro vertical

Habilidad

El valor de la propiedad de altura de línea es igual al valor de la propiedad de altura de caja

Familia tipográfica

Nombre del Atributo

Familia tipográfica

valor de atributo

nombre de la fuente

ejemplo

font-family:楷体;

expandir

El valor del atributo de familia de fuentes puede escribir múltiples nombres de fuentes, cada fuente está separada por una coma, la secuencia de ejecución es buscar el
atributo de familia de fuentes de izquierda a derecha y finalmente establecer un nombre de familia de fuentes. Se recomienda usar sans fuentes serif para desarrollo web

propiedad compuesta de fuente

Escenas a utilizar

Establecer el estilo común del texto de la página web

Atributo compuesto

La abreviatura de atributos, un atributo corresponde a múltiples valores, y cada valor de atributo está separado por un
espacio

ejemplo

div {
 font:italic 700 30px/2 楷体;
}

Aviso

Se debe escribir el tamaño de fuente y el valor de fuente; de ​​lo contrario, el atributo de fuente no tendrá efecto

guion de texto

Nombre del Atributo

índice de texto

valor de atributo

Número+px
número+em (1em=el tamaño de fuente de la etiqueta actual)

alineación del texto

Rol: Controlar la alineación horizontal del contenido

Nombre del atributo: línea de texto

valor de atributo

alineación izquierda-izquierda (predeterminada) alineación derecha-derecha
centrada en el centro

Alineación horizontal - Imagen

La esencia de text-aline es controlar la alineación del contenido, y el atributo debe establecerse en el padre del contenido.

línea de decoración de texto

Nombre del Atributo

decoración de texto

valor de atributo

Atributos valor de atributo
ninguno ninguno
subrayar subrayar
línea directa tachado
superposición subrayar

color del texto color

Nombre del Atributo

color

valor de atributo

Representación de colores

Color palabras clave-color palabras en inglés

notación rgb - rgb (r, g, b) - valor de tres colores primarios rgb 0-255
notación rgba - rgba (r, g, b, a) a significa valor de transparencia 0-1

Notación hexadecimal - #RRGGBB
pista

Siempre que el valor del atributo sea color, se pueden utilizar los cuatro métodos de representación de color anteriores, por ejemplo: color de fondo.

Herramienta de depuración - Google Chrome

efecto

Verificar y depurar código; ayudar a los programadores a encontrar problemas de código y resolver problemas

Abre el depurador

F12
inserte la descripción de la imagen aquí

Detalles de la herramienta de depuración

1. Si es un atributo incorrecto, habrá un signo de exclamación amarillo
2. Hay varias casillas de verificación delante del atributo CSS, si está marcado: el atributo entra en vigor

selector compuesto

definición

Compuesto por dos o más selectores básicos combinados de diferentes maneras

efecto

Selección más precisa y eficiente de los elementos de destino (etiquetas)

selector de descendientes

Seleccionar los descendientes de un elemento

fraseología

Selector padre selector hijo {propiedad CSS}, los selectores padre e hijo están separados por espacios.

selector de niños

Seleccionar un elemento hijo de un elemento (hijo más cercano)

redacción del selector

Selector principal > selector secundario {propiedad CSS}, separe los selectores principal y secundario con >

selector de unión

Seleccione varios conjuntos de etiquetas para establecer el mismo estilo

fraseología

Selector 1, selector 2, ... selector N {atributo CSS}, usados ​​entre selectores, separados

selector de intersección

Seleccionar elementos que cumplan múltiples condiciones al mismo tiempo

fraseología

Selector 1 Selector 2 {Atributo CSS}, los selectores están conectados sin ningún símbolo

Aviso

Si hay un selector de etiquetas en el selector de intersección, el selector de etiquetas debe escribirse en la parte superior

inserte la descripción de la imagen aquí

selector de pseudo clase

La pseudoclase representa el estado del elemento, y un cierto estado del elemento seleccionado establece el estilo

estado de mouseover

Selector

hover{CSS属性}

enfatizar

Cualquier etiqueta puede establecer el estado de desplazamiento del mouse

pseudo-clase-hipervínculo

estado
:link	访问前
:visited访问后
:hover	鼠标悬停
:action 点击时(激活)
Aviso

Si desea configurar los cuatro estados anteriores para hipervínculos, debe escribirlos en el orden de LVHA

Supongo que te gusta

Origin blog.csdn.net/weixin_74888502/article/details/132259149
Recomendado
Clasificación