resumo de conhecimentos básicos em html
1. Resumo do conhecimento básico de html
1.html introdução e função
HTML significa HyperText Mark-up Language, que se refere a HyperText Mark-up Language. Marcas são rótulos, por exemplo :, <a></a> <html></html>geralmente os rótulos aparecem em pares, mas também existem ocorrências únicas. Como <br> <img>:.
O significado do hipertexto:
1. Existem imagens, vídeos, música, etc. além do limite de texto nas páginas da Web.
2. Texto do hiperlink: pode saltar de uma página da Web para outra da Web.
Função:
usada para desenvolver páginas da Web
2. Use vscode para programação html
- vscode é um software livre e de código aberto (o uso pessoal é bom)
- Link para download: https://code.visualstudio.com/Download
- O vscode pode instalar dois plug-ins. Um é o plug-in chinês e o outro é o plug-in do navegador em execução. Os nomes dos plug-ins são 1. Chinese (Simplified) Language Pack para VS Code 2. open in brower.
- Você pode clicar na imagem a seguir para exibir o ícone e, em seguida, pesquisar na caixa de pesquisa na parte de trás (ignore a tela suja do computador)
- O uso do vscode não se repetirá muito, os alunos que não sabem como usá-lo podem consultar o artigo CSDN.
3.html algumas tags comumente usadas (incluindo tags únicas e tags que aparecem em pares)
- Aparecendo em pares
<h1>标题标签</h1>
<li>li标签定义列表项目</li>
<p>段落标签</p>
<div>div标签</div>
<a href='https://www.baidu.com'>百度</a>
- Sozinho
<br>
<img src="图片路径" alt="图片描述信息">
Nota: A escrita do rótulo não diferencia maiúsculas de minúsculas, mas geralmente é em minúsculas!
- Defina o caminho do recurso da imagem é
dividido em caminho absoluto e caminho relativo. Caminho absoluto significa escrever a partir do diretório raiz e caminho relativo para escrever a partir do diretório atual.
4. Tipos de tags
Existem três tipos de tags: tags de tabela, tags de lista e tags de formulário
- Etiqueta da lista
<ul>无序列表</ul>
<ol>有序列表</ol>
- Rótulo do formulário
<table>
<tr>
<th>table表示表格标签，tr表示表格中的一行，th表示表格中的表头</th>
</tr>
<tr>
<td>表示表格中的一列</td>
</tr>
</table>
- Rótulo do formulário
<form>标签 定义完整的表单标签
<label>标签 表示表单元素的文字标注标签，定义文字标注
<input>标签 表示表单元素的用户输入标签，定义不同类型的用户输入数据方式
type:
type="text"定义单行文本输入框
type="password"定义密码输入框
type="radio"定义单选输入框
type="chackbox"定义复选输入框
type="file"定义上传文件
type="submit"定义提交按钮
type="reset"定义重置按钮
type="button"定义普通按钮
<textarea>标签 定义多行文本输入框
<select>标签 定义下拉列表
<option>和<select>标签配合，定义下拉列表中的选项
- Os atributos do formulário podem ser definidos quando o formulário é enviado, ação significa definir o endereço de envio do formulário e método significa o método de envio do formulário, que é dividido em obter e postar. Configurações de atributo do elemento de formulário, dois parâmetros, nome e valor, nome representa o nome do elemento de formulário e valor representa o valor do elemento de formulário.
<!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>
<!-- 把数据提交给web服务器需要使用的表单标签：<form> -->
<form action="https://www.baidu.com" method="POST">
<!-- get方式提交数据到web服务器以地址栏的方式提交给web服务器，不安全，能看到提交的数据 -->
<!-- 严谨的说是以查询参数的方式提交给web服务器 -->
<!-- Post 方式提交表单数据会放到请求体里面 -->
<p>
<!-- for 根据id名给指定id的标签设置光标 -->
<label>用户名：</label>
<input type="text" name="username" >
</p>
<p>
<label>密码：</label>
<input type="password" name="password">
</p>
<p>
<label>性别：</label>
<input type="radio" name="gender" value="0">男
<input type="radio" name="gender" value="1">女
</p>
<p>
<label>爱好：</label>
<input type="checkbox" name="like" value="学习">学习
<input type="checkbox" name="like" value="打游戏">打游戏
<input type="checkbox" name="like" value="羽毛球">羽毛球
</p>
<p>
<label>照片：</label>
<input type="file" name="pic">
</p>
<p>
<label>个人描述：</label>
<textarea name="desc"></textarea>
</p>
<p>
<label>籍贯：</label>
<select name="position">
<option value="0">北京</option>
<option value="1">上海</option>
<option value="2">深圳</option>
<option value="3">西安</option>
</select>
</p>
<p>
<input type="submit" value="提交">
<input type="reset" value="重置">
<input type="button" value="按钮">
</p>
<!--get 和 Post 方式提交表单数据时都以HTTP协议的方式提交数据给web服务器 -->
</form>
</body>
</html>