HTML学习总结
一.开发工具的使用VS code
HTML骨架
html:5+tab
快速创建标签
元素+tab
一次性创建多个标签h1-h6
h$*6+tab
自动生成多个元素
div*5+tab
注释
ctrl+/
同时编辑多个标签
按住滚轮往下拉
HTML骨架的复习
DTD
出现在第一行，表明文件格式
<head></head>
网页的配置
<body></body>
网页的正式内容
utf-8和gbk
用于国际和国内的字符集
title标签
配置页面标题
keywards和description
搜索引擎
HTML的基本用法
标签
标签名需写在<>内
分为双标签和单标签，双标签必须成对出现，有开始和结束标签
结束标签必须有/
根据存放内容不同，标签分为文本级标签和容器级标签
容器级标签
div,ul,ol,dl,dt,dd,h1-h6
文本级标签
img,b,u,i,span
标签属性
属性包括属性名和属性值，在标签名后面空格，之后 属性名="属性值"
标签对空白换号不敏感
标签的空白折叠现象
HTML常用标签的复习
h标签
双标签，容器级
给内部内容添加对应等级的标题
p标签
双标签，文本级
添加一段文字
img标签
单标签，文本级
插入一张图片
<img src="" alt="">
src引入图片路径（网址或者本地）
alt代表图片加载不出来替换的文本
添加width，heigth设置宽高，title设置悬停文字，border设置边框
有序和无序列表的复习
无序列表
<ul>
<li></li>
</ul>
有序列表
<ol>
<li></li>
</ol>
注意：ol标签的内部必须只能嵌套li，li标签的内部可以嵌套任何标签
定义列表的复习
dl,dt,dd
表格的分区
分为三个部分 表格的标题、表头、主题
table内部有三个分区标签组成
caption定义表格标题
thead定义表格表头，内部嵌套tr>th
tbody定义表格主题，内部嵌套tr>td
一部分单元格需要进行跨行跨列合并，可以给对应的td和th标签设置相关属性
rowspan: 上下跨行合并
colspan：左右跨列合并
form表单
方法提交的方法：method
属性值：post和get
数据提交的位置：action
input标签
属性：type
输入框
俩个重要属性
value
设置默认显示的内容
placeholder
提示用户的文字占位符
密码框
掩码形式
<input type="password" placeholder="">
选择框
单选框
<input type="radio" name="">
需要设置相同的name属性
复选框
<input type="checkbok" name="hoddy">
开始默认选择一个，需要添加条件
<input type="checkbok" name="hoddy" checked="checked">
扩大触发范围
<label></label>
文本域
textarea标签
属性值是rows和cols
下拉菜单
select和option标签
<select>
<option>北京</option>
<option>上海</option>
<option>广州</option>
<option>深圳</option>
</select>
HTML字符实体
手册
https://www.w3school.com.cn/html/html_entities.asp
HTML布局常用标签- div和span
div：分割跨度大跨度：分割页面布局
div是容器级标签，双标签
span：小区域小跨度：分割文字布局