HTML标签
HTML实体字符
空格
> >
< <
& &
" "
' '
© 版权符号©
® ®
按标签的的功能分类
HTML主体结构标签
<!--文档级结构标签-->
<!DOCTYPE html> <!--声明头 -->
<html>
<!--头标签-->
<head>
</head>
<!--体标签-->
<body>
内容级结构标签，都应该在body标签中
</body>
</html>
1、最顶部声明<!DOCTYPE html>
声明是文档的第一成份，位于文档的最顶部。该标签就是告诉浏览器所使用的HTML规范。
2、以<html>开始，以</html>结束，中间包含头部标签及主体标签
<head>标签中常用的标签
设置网页标题及浏览器信息
<head lang="en">
<!--
lang是language的意思,lang="en" 属性对页面声明主要语言，en表示英文，zh-cn表示中文。
搜索引擎不会判断该站点是中文还是英文，它让搜索引擎知道你得站点是中文站，这些都是HTML规范，越规范，越容易被收录
-->
<title></title>设置页面字符串
<meta charset="utf-8" /> 设置页面字符集（h5）
<meta http-equiv="content-type" content="text/html;charset=utf-8" />设置页面字符
集(h4)
<!--http-equiv 告知浏览器的行为-->
设置5秒后自动跳转到学习猿地
<meta http-equiv="refresh" content="5;url=https://www**c.lmonkey.com" />
设置浏览器5秒刷新一次
<meta http-equiv="refresh" content="5" />
<!--name 告知浏览器的内容-->
设置网站关键字，多个关键字之间用英文状态下的逗号分割
<meta name="keywords" content="关键字1,关键字2"/>
设置网站的描述
<meta name="description" content="描述的内容" />
<!--阻止移动浏览器自动调整页面大小-->
<meta name="viewport" content="initial-scale=2.0,width=device-width" />
<!--
name = "viewport" 说明此meta标签定义视口的属性
initial-scale = 2.0 意思是将页面放大两倍
width = device-width 告诉浏览器页面的宽度的能与设备的宽度
-->
<meta name="viewport" content="width=device-width,maximun-scale=3,minimum-scale=0.5" />
<!--允许用户将页面最大放大至设备宽度3倍，最小压缩至设备宽度的一半-->
<meta name="viewport" content="initial-scale=1.0,user-scalable=no" />
<!--禁止用户缩放，可以在混合APP时，为了使html页面更逼真，使页面无法缩放。user-scalable=no是禁止缩放-->
<link />
定义两个文档之间连接的关系
<!--
rel = "表示文档与被连接文档之间的关系"
type = "被连接文档的类型"
href = "被连接文档的地址"
-->
<link rel="icon" type="" href=""/>加载标题icon图标
<link rel="stylesheet" type="text/css" href="" />加载CSS样式
<style></style> 加载CSS样式
<script></script> 加载JS脚本
<!--示例-->
<head>
<title>这是我们的第一个HTML页面</title>
<meta charset="utf-8" />
<!-- <meta http-equiv="refresh" content="3;url=http://www.baidu.com">-->
<meta name="keywords" content="h5,html5,js,jq,vue,react"/>
<meta name="description" content="mm131美图图片网。。。。。。" />
<link rel="icon" href="./img/a.jpeg">
<link rel="stylesheet" href="./style.css" />
<script>
alert('弹弹弹，弹奏鱼尾纹')
</script>
<style>
p{
font-size:100px
}
</style>
</head>
<body>标签中常用的标签
网站主体显示的内容
排版标签
主要用于表示html代码的整体结构关系，或可理解为用于搭建出网页的基本层次结构。
语义化标签-布局
<div></div> 代表一个区块 独占一行
<span></span> 行内元素
<header></header> 代表一个页面的头部
<footer></footer> 代表一个页面的底部
<nav></nav> 导航标签
<address></address> 地址标签
<section></section> 代表一个区块
<article></article> 代表一篇文章
<aside></aside> 代表一个侧边栏
列表标签-布局
<ol>有序列表
<ul>无序列表
<dl>定义列表
<dt>定义列表中的项：<dl><dt></dt></dl>
<dd>对于定义列表中定义项的描述
<!--案例-->
<body>
<h2>有序列表</h2>
<ol type="1 a A i I none" start="起始位置">
<li>我是有序列表的列表项</li>
<li>我是有序列表的列表项</li>
<li>我是有序列表的列表项</li>
<li>我是有序列表的列表项</li>
</ol>
<h3>无序列表</h3>
<ul type="disc circle square">
<li>我是无序列表</li>
<li>我是无序列表</li>
<li>我是无序列表</li>
<li>我是无序列表</li>
<li>我是无序列表</li>
</ul>
<hr>
<h2>定义列表</h2>
<dl>
<dt>
<img src="../lesson01/img/a.jpeg" width="80"/>
</dt>
<dd>
<p>
商品价格:<span>￥99</span>
</p>
<p>商品描述：<span>前端</span></p>
<p>放入购物车</p>
</dd>
</dl>
</body>
超链接标签
<a></a>
<!--常用属性-->
<a href = 
最低0.47元/天 解锁文章
4358
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
