背景:
最近学习了尚硅谷的HTML+CSS学习教程,已浅显的完成了HTML部分的学习,整理所学内容,遂写此一篇,以供后续复习。
内容:
<!--文档声明部分,说明我们的网页是HTML5的-->
<!DOCTYPE html>
<html lang="en">
<head>
<!--说明网页采用UTF-8字符集编码-->
<meta charset="UTF-8">
<!--设置网页标题,对搜索引擎重要-->
<title>HTML复习</title>
<meta name="keywords" content = "复习HTML">
<meta name="description" content="这个网页是我用来复习网页的骨架-HTML的">
<!--隔100秒跳转至其他页面,估计那些垃圾网站的跳转用的就是这个-->
<meta http-equiv="refresh" content="100"; url = "https://eone.neu.edu.cn">
</head>
<body>
<!--h标签独占一行,称为块元素-->
<h1 id="head">这是我的网页的一级标题</h1>
<h2>这是我的网页的二级标题</h2>
<h3>这是我的网页的三级标题</h3>
<!--p标签表示网页中的一段-->
<p>这是我的网页的第一段,第一段,第一段,第一段,,,,,,,,,</p>
<!--blockquote表示引用别人的话-->
鲁迅说
<!---->
<blockquote>
“时间就像海绵里的水,只要愿挤,总还是有的。”
</blockquote>
<!--br标签表示换行-->
<br><br>
<!--ol有序列表, ul无序列表, dl定义列表-->
<ol>
<li>这是列表中第一项</li>
<li>这是列表中第二项</li>
<li>这是列表中第三项</li>
</ol>
<ul>
<li>这是列表中第一项</li>
<li>这是列表中第二项</li>
<li>这是列表中第三项</li>
</ul>
<dl>
<dt>HTML</dt>
<dl>HTML是网页的结构,不关注具体样式,是网页的骨架</dl>
</dl>
<!--a标签表示超链接,有以下几种用法-->
<!--跳转至绝对路径-->
<a href="https://eone.neu.edu.cn" ></a>
<!--跳转至相对路径,注意相对路径的表示方法, ./表示当前目录, ../表示当前目录的上级目录-->
<a href="./first.html"></a>
<!--采用target指定超链接打开方式,在原页面打开或另外打开一个页面-->
<a href="https://eone.neu.edu.cn" target="blank"></a>
<a href="https://eone.neu.edu.cn" target="self"></a>
<!--通过给元素指定id跳转至页面任何位置,#是到页面顶部-->
<a href="#head">跳转至页面开始</a>
<br><br>
<!--javascript可做占位符,点击什么都不发生-->
<a href="javascript:;">占位符</a>
<br><br>
<!--通过img标签向页面加入图片-->
<img src="./outer/img1.png" alt="这是一张我的证件照" width="200">
<br><br>
<!--通过audio标签向页面中加入音乐, controls表示用户自动控制-->
<audio src="./outer/music.mp3" controls></audio>
<br><br>
<!--通过video标签向页面中加入视频-->
<video src="./outer/video.mp4" width="300"></video>
</body>
</html>
使用VS CODE 的快捷键:
! + Tab键 自动出现网页整体结构
标签名 + Tab键 自动补全标签