学习HTML笔记回顾
五大浏览器
浏览器ie 火狐 谷歌 safari opera浏览器
浏览器渲染引擎（浏览器内核）
web网页标准：
构成：语言 说明
结构 ：HTML 页面元素和内容就是放东西
表现： css 网页元素的外观位置及页面样式比如改颜色
行为：javaScript 网页模型的定义和页面交互
HTML概念
（Hyper Text Markup Laug）超文本标记语言
例：
加粗<strong></strong>
骨架结构
<html>
<head>
<title>网页的标题</title>
</head>
<body>
网页主题内容
</body>
</html>
注释
vscode 加 ctrl+/ 再按取消
标签结构
双标签
单标签<br>
标签关系：
父子关系（嵌套关系）
兄弟关系（并列关系）
1.标题标签
<h1>一级</h1>最重要
。。。
<h6></h6>
2.段落标签
<p> 段落字体</p>
查看有自动换行alt+z
换行
<br>强制换行
水平分割线
<hr>
快捷键
同行ctrl+D选中相同的字
2.文本格式化标签
b strong 加粗
u ins 下划线
i em倾斜
s del 删除
后面的是强调语境
都一样
有语义
3.图片标签
<img src="" alt="">
需要显示对应效果，借助标签属性
src是属性名放图片名字
“ ”属性值
src=“”是标签属性
标签上可以有多个属性
属性间以空格隔开
alt是替换文本
图片加载不出来会显示
title
提示文本
鼠标悬停显示
width和height
只设置一个就会等比例变化
一般只整一个不变形
4.路径
页面需要加载图片，先找到对应的图片
绝对路径（了解）
C:\Users\chenxiang\Desktop\HTML.00
目录下的绝对位置，直达目标位置，从盘符开始的路径
相对路径
从当前文件（html文件）出发找目标文件（图片）的过程
当前图片和目标在同一级
<img src="目标图片.gif">
<img src="./目标图片.gif">
下级目录
目标在下级目录
<img src="images/屏幕截图(64).png" alt="">
上级目录
<img src="../屏幕截图(65).png" alt="">
音频标签
<audio src="./1. Red Dead Redemption 2 - Cruel, Cruel World.mp3" controls autoplay loop></audio>
contols 显示音频控件
autoplay 自动播放（部分浏览器不支持）
loop 循环播放
支持格式：MP3 Wav Qgg
视频标签
除了video其他和audio一样
autoplay的谷歌浏览器需要配合muted实现静音播放
支持MP4 WebM Ogg
超链接标签
hyperlink reference超链接引用
<a href="https://www.bilibili.com/">跳转到哔哩哔哩</a>
<br>
<a href="./相对路径.html">去其他作业</a>
不知道跳到哪里就写#（空链接）
target属性
_self 覆盖原网页（默认值）
_blank 保留原网页
<a href="https://www.bilibili.com/" target="_blank">跳转到哔哩哔哩</a>
列表标签
无序
ul 表无序列表的整体，用于包裹li标签
（ul标签只允许包含li标签）
li表示无序的每一项，用于包含每一行的内容
（li标签可包含任意内容）
有序 明确排序
ol
li
自定义
dl
dt自定义主题标题
dd针对主题的内容
表格标签
table 表格整体，可用于包裹多个tr
tr表格每行，用于包裹td
td表格单元格，用于包裹内容
border 边框宽度
width 表格宽度
heright 表格高度
表格标题和表头单元格标签
表头单元格 th 加粗的属性
表格标题用caption
表格结构标签
thead 头部
tbody 表格主体
tfoot 表格底部
让浏览器看的更舒服
合并单元格
跨行合并（垂直合并成一个）
跨列合并（水平合并）
1.明确合并哪几个
2.上下合并 保留最上的 删除其他的
3.左右合并保留最左的
跨行（rowspan）---上下合并
跨列（colspan） ---左右合并
不能跨thead tbody tfoot来合
表单标签
注册之类的在里面打字时用的
登录 注册 搜索
input系列
type属性值不同，显示不同效果
text 文本框，单行文本
password 输入密码
radio 单选框，多选一
name 分组，有相同name属性的单选框为一组，一组同时只能有一个被选中。
checked 默认选中
checkbox 多选框 多选多
file 文件选择，之后上传文件
submit 提交按钮
reset 重置按钮
button 普通按钮 默认无功能 之后配合js添加功能
文本框的占位符
placeholder 占位符，提示用户输入内容的文本
多个文件上传
multiple 多文件选择
按钮
表单域标签form action=服务器地址
value 改变按钮名称
button按钮标签
（谷歌浏览器默认提交按钮）
属性值
submit提交按钮，点击提交数据给后端服务器
reset重置按钮，恢复
button普通无功能
表单——下拉菜单
select 下拉菜单的整体
option 下拉菜单的每一项
selected 默认选中
textarea文本域标签
cols：规定了文本域内可见宽度
rows：可见行数
label标签
选取文字也可以选用，不止只有文本框的能选
快捷键alt shift 下箭头快速打出下一行相同的
1.label标签把内容包裹起来
2.在表单上添加id属性
3.在label标签中设置对应的id属性值
<input type="radio" name="sex" id="男"><label for="男">男</label>
1.直接label标签把内容和表单标签一起包裹起来
2.把label中for属性删除即可
语义化标签
无语义
div 一行只显示一个
span 一行显示多个
有语义
header 网页头部
nav 网页导航
footer 网页底部
aside侧边栏
section 网页区块
article 网页文章
字符实体
 ；空格
浙公网安备 33010602011771号