résumé des connaissances de base html
Un, résumé des connaissances de base HTML
1.html introduction et fonction
HTML signifie HyperText Mark-up Language, qui fait référence au HyperText Mark-up Language. Les marques sont des étiquettes, telles que:, les <a></a> <html></html>étiquettes apparaissent généralement par paires, mais il existe également des occurrences uniques. Tels <br> <img>que
La signification de l'hypertexte:
1. Il y a des images, des vidéos, de la musique, etc. au-delà de la limite de texte dans la page Web.
2. Texte du lien hypertexte: peut passer d'une page Web à une autre page Web.
Fonction:
utilisée pour développer une page Web
2. Utilisez vscode pour la programmation html
- vscode est un logiciel open source et gratuit (l'utilisation personnelle fait du bien)
- Lien de téléchargement: https://code.visualstudio.com/Download
- vscode peut installer deux plug-ins. L'un est le plug-in chinois, et l'autre est le plug-in exécutant le navigateur. Les noms des plug-ins sont 1. Pack de langue chinois (simplifié) pour VS Code 2. ouvrir dans le navigateur.
- Vous pouvez cliquer sur l'image suivante pour afficher l'icône, puis rechercher dans la zone de recherche derrière (ignorer l'écran d'ordinateur sale)
- L'utilisation de vscode ne sera pas trop répétée, les étudiants qui ne savent pas comment l'utiliser peuvent se référer à l'article du CSDN.
3.html quelques balises couramment utilisées (y compris les balises uniques et les balises qui apparaissent par paires)
- Apparaissant par paires
<h1>标题标签</h1>
<li>li标签定义列表项目</li>
<p>段落标签</p>
<div>div标签</div>
<a href='https://www.baidu.com'>百度</a>
- Séparément
<br>
<img src="图片路径" alt="图片描述信息">
Remarque: l'écriture de l'étiquette n'est pas sensible à la casse, mais elle est généralement en minuscules!
- Définissez le chemin des ressources de l'image est
divisé en chemin absolu et chemin relatif. Chemin absolu signifie écrire à partir du répertoire racine et chemin relatif pour écrire à partir du répertoire courant.
4. Types de balises
Il existe trois types de balises: les balises de table, les balises de liste et les balises de formulaire
- Étiquette de liste
<ul>无序列表</ul>
<ol>有序列表</ol>
- Étiquette de formulaire
<table>
<tr>
<th>table表示表格标签，tr表示表格中的一行，th表示表格中的表头</th>
</tr>
<tr>
<td>表示表格中的一列</td>
</tr>
</table>
- Étiquette de formulaire
<form>标签 定义完整的表单标签
<label>标签 表示表单元素的文字标注标签，定义文字标注
<input>标签 表示表单元素的用户输入标签，定义不同类型的用户输入数据方式
type:
type="text"定义单行文本输入框
type="password"定义密码输入框
type="radio"定义单选输入框
type="chackbox"定义复选输入框
type="file"定义上传文件
type="submit"定义提交按钮
type="reset"定义重置按钮
type="button"定义普通按钮
<textarea>标签 定义多行文本输入框
<select>标签 定义下拉列表
<option>和<select>标签配合，定义下拉列表中的选项
- Les attributs de formulaire peuvent être définis lorsque le formulaire est soumis, l'action signifie la définition de l'adresse de soumission du formulaire et la méthode signifie la méthode de soumission du formulaire, qui est divisée en get et post. Paramètres d'attribut d'élément de formulaire, deux paramètres, nom et valeur, nom représente le nom de l'élément de formulaire et valeur représente la valeur de l'élément de formulaire.
<!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>