Directorio de artículos
introducción html
- El lenguaje html es un lenguaje que usamos para escribir páginas web. Es muy simple. Para ser precisos, html no es un lenguaje de programación, sino un lenguaje de marcado. Las siguientes cosas son algunas de mis ganancias y notas de aprender html.
Definición: HTML se refiere al lenguaje de marcado de hipertexto (lenguaje de
marcado de hipertexto). El lenguaje de marcado es un conjunto de etiquetas de marcado - El llamado hipertexto tiene dos significados: 1. Agrega valientemente imágenes, sonidos, animaciones, multimedia y otros contenidos (más allá del límite de texto) 2. Texto de hipervínculo Por lo tanto, una página web es en realidad un archivo html.
- Como todos sabemos, se necesita un navegador para abrir una página web, pero el kernel de diferentes navegadores es diferente (diferentes kernels interpretan el mismo código de manera diferente), al igual que el kernel de Google Chrome es Blink, de producción nacional. La mayoría de los navegadores utilizan Blink o Webkit. Pero no importa qué navegador seguirá un estándar común, y este estándar es el estándar web. Debemos haber oído hablar del estándar web más o menos. El estándar web es una serie de estándares formulados por la organización W3C (World Wide Web Consortium) y otras organizaciones de estandarización. Una colección de estándares.
- La composición de los estándares web incluye principalmente estructura (Estructura), rendimiento (Presentación) y comportamiento (Comportamiento). Estructura: La estructura se utiliza para ordenar y clasificar los elementos de la página web, en esta etapa aprendemos principalmente HTML. Rendimiento: El rendimiento se utiliza para establecer los estilos de apariencia de los elementos de la página web como el servicio, el color, el tamaño, etc. Se refiere principalmente a CSS. Comportamiento: El comportamiento se refiere a la definición del modelo de página web y la compilación de la interacción, en esta etapa el aprendizaje principal es Javascript.
Especificación de sintaxis HTML
- Las etiquetas HTML son palabras clave entre paréntesis angulares, por ejemplo
<html>
- Las etiquetas se dividen en etiquetas dobles y etiquetas simples (la mayoría de las etiquetas son etiquetas dobles, solo algunas etiquetas son etiquetas simples, por lo que solo necesitamos recordar algunas etiquetas simples y el resto son etiquetas dobles)
- La relación entre etiquetas se divide en relación de contención y relación paralela
Marco HTML
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> </body> </html>- ! DOCTYPE es una declaración, que debe colocarse en la parte superior del documento. Para ser precisos, no es una etiqueta html, sino una etiqueta de declaración de tipo de documento
- html lang = "en" significa que esta es una página web en inglés
html lang = "zh-CN" significa que esta es una página web en chino - Se utiliza para evitar páginas web confusas. UTF-8 se denomina código universal. Generalmente usamos UTF-8 para guardar texto
El significado de algunas etiquetas y cómo usarlas
Etiqueta de título
<h1> </h1> <h2> </h2> <h3> </h3> <h4> </h4> <h5> </h5> <h6> </h6>Función: el texto con la etiqueta del título se volverá más audaz, la fuente será más grande y el título ocupará una línea, y a medida que el número aumente de h1 a h6, la fuente del título se volverá gradualmente más pequeña.
Etiquetas de párrafo y salto de línea
Etiquetas de párrafo:
<p>Etiqueta de nueva línea
<br/>Donde la etiqueta de nueva línea es una sola etiqueta
Etiquetas de formato de texto
<strong> <em> <del> <ins>Estas etiquetas son etiquetas en negrita, etiquetas inclinadas, etiquetas tachadas y etiquetas de subrayado. Estas etiquetas no tienen nada que introducir y las etiquetas funcionan como su nombre indica.
Etiqueta de la caja
<div> <span>Estas dos etiquetas no tienen semántica, al igual que un cuadro, que se utiliza para contener el contenido y el diseño, así que lo llamo etiqueta de cuadro. Hay una diferencia entre estas dos etiquetas. El div es un cuadro grande y el intervalo es un cuadro pequeño. Solo se puede colocar una etiqueta div en una fila, pero se pueden colocar varias etiquetas span.
Etiqueta de imagen y etiqueta de ruta
<img>Esta es una sola etiqueta, la etiqueta img tiene muchos atributos
Atributos Valor de atributo efecto src Ruta de la imagen alt texto Reemplazar texto, usar texto cuando la imagen no se pueda mostrar título texto Mensaje de texto, mouse sobre la imagen para mostrar el texto ancho / alto / borde px Establezca el ancho / alto / grosor del borde de la imagen sin ningún orden en particular La ruta de la imagen se divide en ruta relativa y ruta absoluta.
La ruta relativa se divide en tres formatos
Cuando la dirección de la imagen está en el nivel superior del archivo html
<img src = "文件名.格式" />Cuando la dirección de la imagen está al mismo nivel que el archivo html
<img src = "文件夹名 / 文件名.格式" />Cuando la dirección de la imagen está en el siguiente nivel del archivo html
<img src = "../ 文件名.格式" />Camino absoluto:
<img src = "绝对位置 \ 文件名.格式 / "Etiqueta de hipervínculo
- Formato de sintaxis del enlace
<a href = "跳转目标" target = "目标窗口的弹出方式">文本或图像</a>href se usa para especificar la dirección URL del destino del enlace. El
destino se usa para especificar el método de apertura de la página vinculada. Sus valores de atributo se dividen en dos tipos, self y blank, donde self es el valor predeterminado, lo que significa que esta página se reemplaza con una página vinculada, y en blanco está en La página vinculada se abre en una nueva ventana.- Clasificación de enlaces
-
- Enlace externo, href = "http: // URL"
- Enlace interno, href = "filename.html".
- Conexión nula, href = "#"
- Enlace de descarga, si la dirección en href es un archivo o paquete comprimido, este archivo se descargará
- Enlace de elemento de página web
- Enlace de anclaje: puede localizar rápidamente la ubicación de la página (equivalente al contenido de este artículo) Anchor href = "etiqueta" ID de destino = "etiqueta" El enlace de anclaje debe agregar un atributo de identificación a la ubicación de destino, el atributo de identificación secundario El valor debe ser coherente con el valor href en el enlace de anclaje.
Comentario
Formato:
<!-- 文本 -->
Tecla de acceso directo: Ctrl + /Caracteres especiales
En el archivo html, no se pueden generar algunos caracteres. En este momento, necesitamos usar algunos métodos de representación especiales para generar estos caracteres
空格   < < > >Etiqueta de formulario
- formato
<table><tr><td>...</td></tr></table> <th></th>La tabla es la etiqueta de la tabla, la etiqueta de la fila y la etiqueta de la celda deben colocarse en la etiqueta de la tabla; tr es la etiqueta de la fila, td es la etiqueta de la celda en el medio de cada fila y th es la celda del encabezado.
- Atributos de la tabla
-
Atributos efecto Valor de atributo alinear El texto está centrado, alineado a la izquierda, alineado a la derecha centro / izquierda / derecha frontera Especifica si la celda tiene un borde px relleno celular La distancia entre el texto de la tabla y el borde. px ritmo celular Distancia de celda a celda px ancho / alto El largo y ancho de la mesa. px - Etiqueta de estructura de mesa
<thead>和<tbody>- Combinar células
Combinar celdas en filas :
rowspan = número
de celdas combinadas Combinar celdas en columnas:
colspan = número de celdas combinadasEtiqueta de lista
1. Lista desordenada
<ul> <li>...</li> ... </ul>2. Lista ordenada
<ol> <li>...</li> ... </ol>3. Lista personalizada
<dl> <dt>...</dt> <dd>...</dd> ... </dl>Etiqueta de formulario
El formulario incluye tres partes: campos de formulario, controles de formulario e información de solicitud
- Campo de formulario:
<form action = "url地址" method = ”提交方式“ name = "表单域名称"></form>- Controles de formulario:
-
- entrada (etiqueta única)
Atributos tipo nombre valor comprobado longitud máxima - El valor de atributo del atributo de tipo
-
El valor de atributo del atributo de tipo botón caja archivo oculto imagen contraseña radio Reiniciar enviar texto - Marcar etiqueta
<label>El valor de atributo de for en la etiqueta debe ser consistente con el valor de atributo de id en input
- Formulario desplegable
<select> <option>选项</option> ...... <option selected = "selected"> (默认为选中状态) </select>- Campo de texto
<textarea>El campo de texto puede crear un cuadro de entrada de texto de varias líneas.
Escritas al final, estas son algunas notas que tomé cuando estaba aprendiendo html. Principalmente registraba el papel de varias etiquetas de html. Después de todo, html es un lenguaje de marcado. Después de aprender el uso de etiquetas, html será útil.
Las anteriores son algunas de las etiquetas más utilizadas en html, pero no todas. En el proceso de uso diario, a menudo olvidamos el método de uso o el formato de algunas etiquetas, o queremos usar algunas etiquetas impopulares menos utilizadas, aquí recomiendo un sitio web W3C para todos (se puede hacer clic directamente en este Sí), en este sitio web podemos consultar todas las etiquetas de algunos html y css, lo cual es muy fácil de usar, si este artículo original es útil para ustedes, estoy muy feliz y deseo que todos ustedes se fortalezcan.