Un elemento de bloque es generalmente un elemento contenedor para otros elementos. Los elementos de bloque generalmente comienzan en una nueva línea. Puede acomodar elementos en línea y otros elementos de bloque. Un elemento de bloque común es la etiqueta de párrafo "P". En particular, solo se puede usar para acomodar otros elementos de bloque.
Sin la función de CSS, los elementos del bloque se organizarán una fila a la vez. Con CSS, podemos cambiar el diseño predeterminado de este HTML. elemento donde lo desee, en lugar de comenzar estúpidamente una nueva línea cada vez. Cabe señalar que la etiqueta de la tabla también es un tipo de elemento de bloque, y generalmente se utilizan el diseño basado en tablas y el diseño basado en CSS. (excluyendo a las personas con discapacidad visual, personas ciegas, etc.), no hay otra diferencia entre los dos diseños excepto la velocidad de carga de la página. Sin embargo, si un usuario normal hace clic sin darse cuenta en el botón Ver código fuente de la página, aparecerán los dos diseños. La diferencia mostrada por los usuarios es muy grande. El código fuente de la página de diseño CSS diseñado según el concepto de buena reconstrucción puede al menos permitir que los usuarios comunes sin experiencia en desarrollo web comprendan rápidamente el contenido. mejor experiencia estética.
Puede pensar en el elemento contenedor de bloques div como una caja, o si ha jugado con el recorte, será más fácil de entender. Primero extraigamos los artículos requeridos de varios periódicos. El contenido cortado es un bloque. Luego pegamos estos trozos de papel en un nuevo trozo de papel en blanco para formar su propio resumen único. Como una extensión de la tecnología, el diseño de diseño web también sigue el mismo patrón
que generalmente se basa en la semántica
.Los elementos en línea (semánticos) solo pueden contener texto u otros elementos en línea. El elemento en línea común "a"
debe explicarse: el nombre chino del elemento en línea tiene varios elementos en línea, elementos en línea, elementos en línea y elementos directos Básicamente no existe una traducción unificada. Llámalo como quieras. Además, cuando se trata de elementos en línea, pensaremos en un atributo de visualización llamado display:inline. problema de límite flotante
(elemento de bloque) y elemento en línea (elemento en línea) son conceptos en la especificación HTML. La diferencia básica entre elementos de bloque y elementos en línea es que los elementos de bloque generalmente comienzan en una nueva línea. La diferencia de atributos entre elementos de bloque y elementos en línea no se convierte en un problema. Hay una diferencia. Por ejemplo, podemos agregar un atributo como display:block a la cita del elemento en línea, para que también tenga el atributo de comenzar desde un nuevo. línea cada vez.
El elemento variable cambia con el entorno según los dos anteriores. El concepto básico es que necesita determinar si el elemento es un elemento de bloque o un elemento en línea según el contexto. Los elementos variables todavía pertenecen a las dos categorías de elementos anteriores. Una vez que el contexto determina su categoría, deben seguir las reglas de los elementos de bloque o los elementos en línea.
Detalles de clasificación en línea y en bloque de etiquetas html:
elemento de bloque (elemento de bloque)
div css xhtml xml Código fuente de ejemplo Código fuente de ejemplo
◎ dirección - dirección ◎ cita en bloque - cita en bloque ◎ centro - bloque de alineación ◎ dir - lista de directorios ◎ div - conveniencia de nivel de bloque de uso común, también la etiqueta principal del diseño CSS ◎ dl - lista de definiciones ◎ conjunto de campos - grupo de control de formulario ◎ formulario - interacción Formulario◎ h1 - Encabezado ◎ h2 - Subtítulo ◎ h3 - Encabezado de nivel 3 ◎ h4 - Encabezado de nivel 4 ◎ h5 - Encabezado de nivel 5 ◎ h6 - Encabezado de nivel 6 ◎ hr - Línea divisoria horizontal ◎ isindex - solicitud de entrada
◎ menú - lista de menús ◎ noframes - contenido opcional de marcos (muestra este contenido de bloque para navegadores que no admiten marcos) ◎ noscript - contenido de secuencia de comandos opcional (muestra este contenido para navegadores que no admiten secuencias de comandos)
◎ ol - forma ordenada ◎ p - párrafo ◎ texto preformateado ◎ tabla - tabla ◎ ul -
elemento en línea de lista no ordenada (elemento en línea)
div css xhtml xml Código fuente de ejemplo Código fuente de ejemplo
◎ a - punto de anclaje ◎ abbr - abreviatura ◎ acrónimo - letra inicial ◎ b - negrita (no recomendado)
◎ bdo - anulación de bidi
◎ grande - fuente grande ◎ br - salto de línea ◎ citar - citar ◎ código - código de computadora (obligatorio al citar el código fuente)
◎ dfn - definir campos ◎ em - enfatizar ◎ fuente - configuración de fuente (no recomendado)
◎ i - cursiva ◎ img - imagen ◎ entrada - cuadro de entrada ◎ kbd - definir texto del teclado ◎ etiqueta - etiqueta de tabla ◎ q - cita corta ◎ s - subrayado (no recomendado)
◎ samp: define código de computadora de muestra ◎ select: selección de elementos ◎ small: texto de fuente pequeña ◎ span: contenedor en línea de uso común, define bloques dentro del texto ◎ strike - subrayado ◎ fuerte: énfasis en negrita ◎ sub - subíndice ◎ sup - superíndice ◎ área de texto - cuadro de entrada de texto de varias líneas ◎ tt - texto de télex ◎ u - subrayado ◎ var - definir variable
elemento variable
div css xhtml xml Ejemplo de código fuente Ejemplo de código fuente
Un elemento mutable es un elemento de bloque o un elemento en línea según el contexto.
◎ subprograma-subprograma de Java
◎ botón - botón ◎ del - eliminar texto ◎ iframe - marco en línea
◎ ins - texto insertado ◎ mapa - bloque de imágenes (mapa)
◎ objeto - objeto objeto ◎ script - script de cliente