Elementos de nivel de bloque (nivel de bloque)
-
Monopolio
-
Altura, ancho, margen exterior y margen interior pueden ser controlados
-
El ancho predeterminado es el 100% del contenedor (ancho principal)
-
Es un contenedor y una caja en la que puede colocar elementos internos o de nivel de bloque.
-
Los elementos de nivel de bloque no se pueden colocar en p, especialmente p no se puede colocar en div
-
h1 ~ h6, dt, son todas etiquetas de nivel de bloque de tipo texto, y no se pueden colocar otros elementos de nivel de bloque en ellas.
-
Los elementos de bloque comunes son <h1> ~ <h6>, <p>, <div>, <ul>, <ol>, <li>, etc.
La etiqueta es el elemento de bloque más típico.
Nivel en línea
-
Se pueden mostrar varias líneas.
-
La configuración directa de alto y ancho no es válida.
-
El ancho predeterminado es el ancho de su propio contenido.
-
Los elementos en línea solo pueden contener texto u otros elementos en línea.
-
No se pueden colocar más enlaces en el enlace
-
En casos especiales, los elementos de nivel de bloque se pueden colocar en a, pero es más seguro cambiar el modo de bloque a a.
-
Los elementos en línea comunes son <a>, <strong>, <b>, <em>, <i>, <del>, <s>, <ins>, <u>, <span>, etc., donde las etiquetas son las más típicas Elementos en línea. Algunos lugares también se convierten en elementos en línea.
Elementos de bloque en línea
-
Está en la misma línea que el elemento de línea adyacente (bloque en línea), pero habrá un espacio entre ellos. Una línea puede mostrar múltiples
-
El ancho predeterminado es el ancho de su propio contenido.
-
La altura, la altura de la línea, el margen exterior y el margen interior se pueden controlar.
-
Hay varias etiquetas especiales en los elementos en línea: <img />, <input />, <td>, puede establecer el ancho y la altura y los atributos de alineación en ellos, algunos materiales pueden llamarlos elementos de bloque en línea.
Modo elemento | Arreglo de elementos | Establecer estilo | Ancho predeterminado | Contiene |
---|---|---|---|---|
Elemento a nivel de bloque | Solo se puede colocar un elemento de nivel de bloque en una línea | Puede establecer la altura del ancho | 100% del contenedor | El nivel de contenedor puede contener cualquier etiqueta |
Elemento en linea | Puedes poner varios elementos en una fila | No es posible establecer el ancho y la altura directamente | El ancho de su contenido | Acomodar texto u otros elementos en línea |
Elemento de bloque en línea | Ponga múltiples elementos de bloque en línea en una línea | Puede establecer ancho y alto | El ancho de su contenido |
Visualización de conversión del modo de visualización de etiquetas
- Dentro de la transición de bloque: pantalla: en línea;
- En línea: pantalla: bloque;
- Bloques, los elementos en línea se convierten en bloques en línea: pantalla: bloque en línea;