网页相关的标签
1.标题标签
<!-- 标题标签 -->
<h1>一级标签</h1>
<h2>二级级标签</h2>
<h3>三级级标签</h3>
<h4>四级标签</h4>
<h5>五级标签</h5>
<h6>六级标签</h6>
2.段落标签
<!--段落标签快捷键先按p在按tab-->
<p></p>
<!--段落标签-->
<p>当你的眼睛眯着笑</p>
<p>当你喝可乐 当你吵</p>
<p>我想对你好 你从来不知道</p>
<p>想你 想你也能成为嗜好</p>
<p>当你说今天的烦恼</p>
<p>当你说夜深 你睡不着</p>
<p>我想对你说 却害怕都说错</p>
<p>好喜欢你 知不知道</p>
如果没加段落标签，在网页上显示则不分段。
加了段落标签之后，与之前对比文本内容分段了
3.换行标签
<!--换行标签只有一个<br/>，不是成对的-->
<!--段落标签-->
当你的眼睛眯着笑<br/>
当你喝可乐 当你吵<br/>
我想对你好 你从来不知道<br/>
想你 想你也能成为嗜好<br/>
当你说今天的烦恼<br/>
当你说夜深 你睡不着<br/>
我想对你说 却害怕都说错<br/>
好喜欢你 知不知道<br/>
4.水平标签
<!--水平线标签-->
<hr/>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title> 网页基本标签</title>
</head>
<body>
<!--Html5注释的快捷键按ctrl+/ -->
<!-- 标题标签 -->
<h1>一级标签</h1>
<h2>二级级标签</h2>
<h3>三级级标签</h3>
<h4>四级标签</h4>
<h5>五级标签</h5>
<h6>六级标签</h6>
<!--段落标签快捷键先按p在按tab-->
<p></p>
<!--段落标签-->
<p>当你的眼睛眯着笑</p>
<p>当你喝可乐 当你吵</p>
<p>我想对你好 你从来不知道</p>
<p>想你 想你也能成为嗜好</p>
<p>当你说今天的烦恼</p>
<p>当你说夜深 你睡不着</p>
<p>我想对你说 却害怕都说错</p>
<p>好喜欢你 知不知道</p>
<!--水平线标签-->
<hr/>
<!--换行标签只有一个<br/>，不是成对的-->
<!--段落标签-->
当你的眼睛眯着笑<br/>
当你喝可乐 当你吵<br/>
我想对你好 你从来不知道<br/>
想你 想你也能成为嗜好<br/>
当你说今天的烦恼<br/>
当你说夜深 你睡不着<br/>
我想对你说 却害怕都说错<br/>
好喜欢你 知不知道<br/>
</body>
</html>
5.字体样式标签
<!-- 粗体，斜体 -->
<!--字体样式标签-->
粗体： <strong>I miss you,yuting</strong>
斜体： <em>I miss you,yuting</em>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title> 网页基本标签</title>
</head>
<body>
<!--Html5注释的快捷键按ctrl+/ -->
<!-- 标题标签 -->
<h1>一级标签</h1>
<h2>二级级标签</h2>
<h3>三级级标签</h3>
<h4>四级标签</h4>
<h5>五级标签</h5>
<h6>六级标签</h6>
<!--段落标签快捷键先按p在按tab-->
<p></p>
<!--段落标签-->
<p>当你的眼睛眯着笑</p>
<p>当你喝可乐 当你吵</p>
<p>我想对你好 你从来不知道</p>
<p>想你 想你也能成为嗜好</p>
<p>当你说今天的烦恼</p>
<p>当你说夜深 你睡不着</p>
<p>我想对你说 却害怕都说错</p>
<p>好喜欢你 知不知道</p>
<!--水平线标签-->
<hr/>
<!--换行标签只有一个<br/>，不是成对的-->
<!--段落标签-->
当你的眼睛眯着笑<br/>
当你喝可乐 当你吵<br/>
我想对你好 你从来不知道<br/>
想你 想你也能成为嗜好<br/>
当你说今天的烦恼<br/>
当你说夜深 你睡不着<br/>
我想对你说 却害怕都说错<br/>
好喜欢你 知不知道<br/>
<!-- 粗体，斜体 -->
<!--字体样式标签-->
粗体： <strong>I miss you,yuting</strong>
斜体： <em>I miss you,yuting</em>
</body>
</html>
6.注释和特殊符号
<!--特殊符号-->
空 格
空 格
<br/>
>大于
<br/>
<小于
<br/>
©版权所有guanguan
<!--特殊符号记忆方式
& ;
-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title> 网页基本标签</title>
</head>
<body>
<!--Html5注释的快捷键按ctrl+/ -->
<!-- 标题标签 -->
<h1>一级标签</h1>
<h2>二级级标签</h2>
<h3>三级级标签</h3>
<h4>四级标签</h4>
<h5>五级标签</h5>
<h6>六级标签</h6>
<!--段落标签快捷键先按p在按tab-->
<p></p>
<!--段落标签-->
<p>当你的眼睛眯着笑</p>
<p>当你喝可乐 当你吵</p>
<p>我想对你好 你从来不知道</p>
<p>想你 想你也能成为嗜好</p>
<p>当你说今天的烦恼</p>
<p>当你说夜深 你睡不着</p>
<p>我想对你说 却害怕都说错</p>
<p>好喜欢你 知不知道</p>
<!--水平线标签-->
<hr/>
<!--换行标签只有一个<br/>，不是成对的-->
<!--段落标签-->
当你的眼睛眯着笑<br/>
当你喝可乐 当你吵<br/>
我想对你好 你从来不知道<br/>
想你 想你也能成为嗜好<br/>
当你说今天的烦恼<br/>
当你说夜深 你睡不着<br/>
我想对你说 却害怕都说错<br/>
好喜欢你 知不知道<br/>
<!-- 粗体，斜体 -->
<!--字体样式标签-->
粗体： <strong>I miss you,yuting</strong>
斜体： <em>I miss you,yuting</em>
<br/>
<!--特殊符号-->
空 格
空 格
<br/>
>大于
<br/>
<小于
<br/>
©版权所有guanguan
<!--特殊符号记忆方式
& ;
-->
</body>
</html>
7.图像标签
JPG、GIF、GIF、PNG、BMP…
图片放置地址
地址正确就可以找到图片
把地址resource改为source地址错误，则返回 alt="guan头像"的信息
加上 title="悬停文字"后，鼠标箭头悬停在图片上则会显示文字
加上title=“悬停文字” height=“300” width="300"限制图片大小
8.链接标签
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>图像标签</title>
</head>
<body>
<!--img学习
src : 图片地址（必填）
相对地址（推荐使用），绝对地址
../ 上一级目录
alt: 图片名字（必填）
title:鼠标悬停在图片上显示文字
width:图片的宽
height:图片的高
-->
<img src="../resource/image/guan.jpg" alt="guan头像" title="悬停文字" height="300" width="300">
</body>
</html>
9.文本标签
图像超链接
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>链接标签</title>
</head>
<body>
<!---->
<a name="top">顶部</a>
<!--a标签
href:必填，表示要跳转到那个页面
target:表示窗口在哪里打开
_blank 在新标签中打开
_self 在自己的网页中打开
-->
<a href="1.我的第一个网页.html" target="_blank">点击我跳转到页面一</a>
<br/>
<a href="https://www.baidu.com" target="_self">点击我跳转到百度</a>
<br/>
<!--图片超链接-->
<a href="1.我的第一个网页.html">
<img src="../resource/image/guan.jpg" alt="guan头像" title="悬停文字" height="300" width="300">
</a>
<p>
<a href="1.我的第一个网页.html">
<img src="../resource/image/guan.jpg" alt="guan头像" title="悬停文字" height="300" width="300">
</a>
</p>
<p>
<a href="1.我的第一个网页.html">
<img src="../resource/image/guan.jpg" alt="guan头像" title="悬停文字" height="300" width="300">
</a>
</p>
<p>
<a href="1.我的第一个网页.html">
<img src="../resource/image/guan.jpg" alt="guan头像" title="悬停文字" height="300" width="300">
</a>
</p>
<p>
<a href="1.我的第一个网页.html">
<img src="../resource/image/guan.jpg" alt="guan头像" title="悬停文字" height="300" width="300">
</a>
</p>
<p>
<a href="1.我的第一个网页.html">
<img src="../resource/image/guan.jpg" alt="guan头像" title="悬停文字" height="300" width="300">
</a>
</p>
<!--功能性链接
邮件链接:mailto
QQ链接
-->
<a href="mailto:2054210430@qq.com">点击联系我</a>
<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=2054210430&site=qq&menu=yes">
<img border="0" src="http://wpa.qq.com/pa?p=2:2054210430:53"
alt="联系我，告诉你变帅秘诀" title="联系我，告诉你变帅秘诀"/></a>
<!--锚链接
1.需要一个锚标记
2.跳转到标记
-->
<a href="#top">回到顶部</a>
</body>
</html>
总结
本篇笔记是基于B站up主：遇见狂神说的笔记进行学习，感兴趣的可以去B站进行学习。网站地址：https://space.bilibili.com/95256449，以上就是今天要讲的内容，本文仅仅通过简单了解网页相关的标签。好了今天的内容就到这里了，下一篇再见
本文含有隐藏内容，请 开通VIP 后查看