Érase una vez, un hombre publicó un borrador de diseño. Después de publicar el borrador de diseño, abrió un DW y arrastró una página. Después de trabajar duro, tuvo que escribir un fondo. El hombre de artes marciales llamado "artista".
El siguiente es un artículo de tutorial sobre la experiencia y el análisis de la semántica HTML5 y la semántica HTML5. El contenido es un tutorial cuidadosamente seleccionado y compilado por este sitio web. Espero que sea útil para los internautas. El siguiente es el contenido detallado:
Algunos yys antes del principioÉrase una vez, un hombre publicó un borrador de diseño. Después de publicar el borrador de diseño, abrió un DW y arrastró una página. Después de trabajar duro, tuvo que escribir un fondo. El hombre de artes marciales llamado "artista". Lo que es aún más difícil es que cuando cada necesidad cambia, puede modificar mucho entumecimiento.
Entonces Div+CSS fue llevado a la etapa de la era de Internet, y más de un libro de girasol "Div+CSS" nació durante la noche. En ese momento, vivíamos en la era de Div+CSS, y en ese momento, lo usamos.
Después de eso, mi cintura no estaba dolorida, mis piernas no estaban lastimadas y me emocioné más cuando trabajaba horas extras.
Yy termina, llega al temaGhost una vez explicó la semántica en el artículo "Semantización en la refactorización de la página" hace dos años, y también el muelle "¿Cuáles son los beneficios de las estructuras HTML semánticas?》
La reconstrucción ha tomado 7 años. Quizás hoy podemos escribir una página hábilmente, pero ¿qué tan fácil es escribir bien una página? Ordenemos nuestras ideas, revisemos los conceptos básicos y las combinemos con las tendencias actuales y luego hablemos sobre el tema de la semántica. ¿Es la semántica de Shenma? ¿Por qué semántico?
La semántica en la reconstrucción se puede dividir básicamente en dos partes: (x) semántica de etiquetas HTML y semántica de nombres de CSS.
Sin tonterías:
(Figura 1)
Figura 1 El método de implementación de no semántica: no_emantic_html El método de implementación de semántica: emantic_html
Tienes razón
¿Tienes un gusto especial? Después de obtener un borrador de diseño, ¿innumerables habilidades mágicas han caído en la pantalla inadvertidamente? Si es no_emantic_html, felicidades por tener un fetiche.
Use etiquetas HTML razonables y sus propiedades únicas para formatear el contenido del documento: esta es la explicación de Shuke de las etiquetas semánticas, por lo que no es posible
No es necesario usar el lugar donde se estructura HTML, porque es una etiqueta semántica. La palabra original es la división, lo que significa separación y bloque. Generalmente solo se usa en el lugar donde HTML está estructurado, en la versión anterior de (x) HTML.
Pero, ¿cómo podemos escribir etiquetas semánticas? Comience con lo básico. Los que más tratamos cada día son etiquetas como Div H1-H6 UL-Li P. Me pregunto si tienes alguna comprensión profunda de estas etiquetas. Echemos un vistazo a la mesa a continuación.
| Etiqueta | Palabra original | ilustrar | Semántica (S/N) |
|---|---|---|---|
| H1-H6 | cabeza | Definir títulos HTML | Y |
| pag | párrafo | Definir párrafos | Y |
| ul | lista desordenada | Definir una lista desordenada | Y |
| olio | lista ordenada | Definir una lista ordenada | Y |
| li | Artículo de la lista | Elementos que definen la lista | Y |
| DL | lista de definiciones | Lista de definición de definición | Y |
| dt | término de definición | Defina los elementos en la lista de definiciones | Y |
| dd | Descripción de la definición | Descripción de los elementos en la lista de definiciones | Y |
| mesa | mesa | Defina la tabla | Y |
| teatro | cabezal | Defina el contenido del encabezado en la tabla | Y |
| cuerpo | cuerpo de mesa | Defina el contenido principal en la tabla | Y |
| th | celda de cabeza | Defina la celda del encabezado en una mesa | Y |
| TR | fila de mesa | Definir filas en tablas | Y |
| TD | celda de datos de tabla | Defina las unidades en la mesa | Y |
| a | ancla | Definir ancla | Y |
| img | imagen | Defina la imagen | Y |
| div | división | Definir secciones en un documento | norte |
| durar | durar | Definir secciones en un documento | norte |
Lo anterior solo enumera algunas de las etiquetas que comúnmente usamos. Para obtener más etiquetas, consulte W3C. Básicamente, todas las etiquetas HTML son abreviaturas de una palabra o frase, lo que en realidad significa que es más conveniente para nuestra comprensión de la semántica. De hecho, entre todas las (x) etiquetas HTML, excepto
Y 2 etiquetas sin semánticas, otras etiquetas tienen sus significados. Solo sabiendo qué etiquetas están allí y entendiendo el significado original de cada etiqueta puede saber cómo usarla. No sabes cuándo usarlo
Todos conocen el festival anual de desnudos CSS, ¿verdad? Si las etiquetas seleccionadas están casi todas sin semántica, entonces casi no hay información estructural en la página web después del estilo, y la legibilidad es muy pobre; Si las etiquetas seleccionadas son adecuadas para la semántica, la página web todavía tiene muy buena legibilidad después de los estilos; Cada navegador tiene su propio estilo predeterminado, y el estilo predeterminado ofrece diferentes pantallas en cada etiqueta. La corrección de la etiqueta puede reflejar la usabilidad del sitio web, que también es una de las formas más fáciles de probar la usabilidad de un sitio web. Esto se recomienda para que todos verifiquen el uso de etiquetas de sitio web oficiales de W3C, use el desarrollador web para deshabilitar su CSS para ver cómo ver. El nombre semántico de CSS se refiere a la clase o nombre de ID adjunto a la etiqueta HTML con un nombre fácil de entender. El nombramiento semántico implica especificaciones de nombres de equipo. Solo por un mejor nombramiento semántico basado en las especificaciones del equipo es el rey. A mi opinión, un nombre semántico de CSS debería al menos cumplir con las siguientes convenciones: Trate de evitar el nombre de Pinyin y use palabras en inglés para nombrarlo Hay tres formas de conectar las palabras: subrayado, símbolos espaciadores y nombres de camellos . Consulte las especificaciones del equipo para un uso específico, pero personalmente recomiendo no usar más de 2 métodos de conexión al mismo tiempo. No siga los números sin sentido después de las palabras , como el logo1234 (excepto el acuerdo del equipo) Para el nombre de las palabras excesivamente largas, puede usar la abreviatura, pero debe asegurarse de que todos los miembros puedan entenderlo. Algunas palabras acordadas pueden ayudarlo a nombrarlas rápidamente: Hay demasiados de esto, así que no los enumeraré uno por uno aquí. Si te encuentras con palabras que no conoces, ¡agregue un poco de inglés! Semántica de nombres de CSS
头:header内容:content/container尾:footer导航:nav侧栏:sidebar栏目:column登录条:loginbar标志:logo广告:banner轮转:promo页面主体:main热点:hot新闻:news 下载:download子导航:subnav菜单:menu子菜单:submenu搜索:search友情链接:friendlink版权copyright
[1] [2] Página siguiente