HTML基础知识
常用文本标签
<em> 着重阅读的内容
<strong> 十分重要的内容（语气比em强）
<span> 没有语义，用于包裹短语的通用容器
<br> 换行标签
<hr> 分割线
<pre>pre>按原文显示
不常用文本标签
<cite> 作品标题（书籍、歌曲、电影、电视节目、会话、雕塑）
<dfn> 特殊术语，或专属名词
<del><ins> 删除的文本 与 插入的文本
<sub><sup>下标文字 与 上标文字
<code> 一段代码
<samp> 从正常的上下文中，将某些内容提取出来，例如：标识设备输出
<kbd> 键盘文本，表示文本是通过键盘输入的，经常用在与计算机相关的手册中
<abbr> 缩写，最好配合上title属性
<bdo> 更换文本方向，要配合dir属性，可选值：ltr(默认值)，rtl
<var>标记标量，可以与code标签一起使用
<small> 附属细则，例如：包括版权、法律文本 --很少使用
<b> 摘要中的关键字、评论中的产品名称 --很少使用
<i> 现在多用于：呈现字体图标
<u>与正常内容有反差文本，例如：错的单词，不合适的描述等。 --很少使用
<q>短引用 --很少使用
<blockquote> 长引用 --很少使用
<address> 地址信息
常见图片格式
jpg：.jpg或.jpeg，有损的压缩格式。支持的颜色丰富、占用空间较小、不支持透明背景、不支持动态图。
png：.png，无损的压缩格式。支持的颜色丰富、占用空间略大、支持透明背景、不支持动态图。
bmp：.bmp，不进行压缩的一种格式。支持的颜色丰富、保留的细节更多、占用空间极大、不支持透明背景、不支持动图。
gif：.gif，仅支持256种颜色，色彩呈现不是很完整。支持的颜色较少、支持简单的透明背景、支持动态图。
webp：.webp，专门在网页中呈现图片，具备以上格式的优势，兼容性不太好。
base64：一串特殊的文本，要通过浏览器打开，传统看图应用通常无法打开。原理是把图片进行base64编码，形成一串文本。
超链接
跳转页面
<a href="https://www.baidu.com" target="_blank">新页签打开a>
<a href="https://www.baidu.com" target="_self">当前页签打开a>
跳转文件
可以是图片、视频、动图、pdf、zip
跳转锚点
方式一：
给跳转目标加锚点：<a name="htl">a>
<a href="#htl">a>
方式二(推荐）：
给跳转目标加锚点：<p id="atm">p>
<a href="#atm">a>
唤起指定应用
<a href="tel:10086">电话联系a>
<a href="mailto:[email protected]">邮箱联系a>
<a href="sms:10086">短信联系a>
列表
有序列表(ol)：ol li
无序列表(ul)：ul li
定义列表(dl)：dl dt
表格
<table> 表格
<caption> 表格标题
<thead> 表格头部 ：<tr> 行 <th> 单元格
<tbody> 表格主体 ：<tr> 行 <td> 单元格
<dfoot> 表格脚注
属性：
colspan 跨多少列
rowspan 跨多少行
表单
method属性：请求方式
文本框与密码框
文本框
<input />
密码框
<input type="password"/>
单选框
<input type="radio" name="sex" value="男">男
<input type="radio" name="sex" value="女" checked>女
复选框
<input type="checkbox" name="course" value="语文" checked>语文
<input type="checkbox" name="course" value="数学">数学
<input type="checkbox" name="course" value="英语">英语
隐藏域
<input type="hidden" name="tag" value="123">
提交与重置
<button>确认button>
<input type="submit" value="确认1">
<button type="reset">重置button>
<input type="reset" value="重置1">
普通按钮
<button type="button">检测账户是否被注册button>
文本域和下拉框
文本域
<textarea name="other" cols="30" rows="10">textarea>
下拉框
<select name="place">
<option value="河北">河北option>
<option value="河南" selected>河南option>
<option value="湖北">湖南option>
<option value="湖南">湖南option>
select>
禁用表单控件
<input disabled/>
可用在input、textarea、button、select、option
label标签
聚焦焦点
<label for="zhanghu">账户：label><input id="zhanghu"/>
<label>账户：<input/>label>
fieldset和legend
用于对表单中的空间分类：主要信息、附加信息
主要信息：
<fieldset>
<legend>主要信息legend>
表单控件···
fieldset>
附加信息
fieldset>
<legend>附加信息legend>
表单控件···
fieldset>
框架标签
<iframe src="https://www.***.com" width="" height="" frameborder="0">iframe>
<a href="https://www.toutiao.com" target="container">点我看新闻a>
<a href="https://www.taobao.com" target="container">点我看淘宝a>
<from action="https://search.toutiao.com/search" target="container">
<input type="text" name="keyword">
<input type="submit" value="搜索">
from>
<iframe name="tt" frameborder="0"width="900" height="300">iframe>
字符实体
//空格
//空格
<//小于号
>//大于号
&//&符号
¥//中文人民币符号
©//版权符号
×//乘法符号
÷//除法符号
全局属性
id：给标签指定唯一标识，同一个文档中的id是不能重复的。不能用在：<head>、<html>、<meta>、<script>、<style>、<title>
class：给标签指定类名，随后通过css就可以给标签设置样式
style：给标签设置css样式
dir：内容的方向，值：ltr、rtl。不能用在：<head>、<html>、<meta>、<script>、<style>、<title>
title：给标签设置一个文字提示，一般超链接和图片用的比较多。
lang：不能用在：<head>、<html>、<meta>、<script>、<style>、<title>
meta元信息
1、配置字符编码
<meta charset="UTF-8">
2、针对IE浏览器的兼容性配置
<meta http-equiv="x-ua-compatible" content="IE=edge">
3、针对移动端的配置
<meta name="viewport" content="width=device-width, initial-scale=1.0">
4、配置网页关键字
<meta name="keywords" content="">
5、配置网页描述信息
<meta name="description" content="">
6、针对搜索引擎爬虫配置
<meta name="robots" content="">
值：
index 允许搜索爬虫索引此页面
noindex 要求搜索爬虫不索引此页面
follow 允许搜索爬虫跟随此页面上的链接
nofollow 要求搜索爬虫不跟随此页面上的链接
all 与index、follow等价
none 与noindex、nofollow等价
noarchive 要求搜索引擎不缓存页面内容
nocache noarchive的替代名称
7、配置网页作者
<meta name="author" content="">
8、配置网页生成工具
<meta name="generator" content="Visual Studio Code">
9、配置定义网页版权信息
<meta name="copyright" content="2023-2027©版权所有">
10、配置网页自动刷新
<meta http-equiv="refresh" content="10;url="">