<body>
? ?<!-- 1 -->
? ?<!-- 跳转到内部文件 -->
? ?<a href="07-相对路径.html">跳转到内部文件</a>
? ?<!-- 跳转到外部网站:网址必须写全 -->
? ?<a href="https://www.baidu.com">跳转百度</a>
</body>
<body>
? ?<!-- 2.跳转 -->
? ?<a href="07-相对路径.html" target="_blank">跳转到内部文件</a>
? ?<!-- target属性可以设置链接跳转, _self默认值:在当前页面打开;_blank在新窗口打开,新窗口不能回退到上一个页面 -->
</body>
<body>
<!-- 3.下载 -->
? ?<a href="../../WebAPIs/html/005-事件解绑.html" download>下载</a>
?
? ?<!-- 4.锚点跳转 href值必须和id值一致-->
? ?<a href="#bottom">跳转到底部</a>
? ?<!-- 空链接: #和javascript:; ? 禁止跳转刷新页面 -->
? ?<a href="#">不跳转</a>
? ?<a href="javascript:;">不跳转</a>
? ?<div>
? ? ? 我是div盒子中的内容,用于观察跳转到底部的标签效果,此处添加大量文字跳转效果才明显
? ? ? ?<hr>
? ? ? ?<h2 id="bottom">底部</h2>
? ?</div>
</body>
特点:独占一行,无论内容有多少,都会独占一行
<!DOCTYPE html>
<html lang="en">
<head>
? ?<meta charset="UTF-8">
? ?<meta name="viewport" content="width=device-width, initial-scale=1.0">
? ?<title>Document</title>
</head>
<body>
? ?<!-- 块元素:独占一行,无论内容有多少,都会独占一行 -->
? ?<h1>标题一</h1>
? ?<p>段落</p>
? ?<div>我是盒子</div>
? ?<ul>
? ? ? ?<li>我是li</li>
? ? ? ?<li>我是li</li>
? ?</ul>
</body>
</html>
特点:紧挨着排列,不能设置宽高,宽高有内容撑开
用法:用来包裹文字,不能放块元素
<!DOCTYPE html>
<html lang="en">
<head>
? ?<meta charset="UTF-8">
? ?<meta name="viewport" content="width=device-width, initial-scale=1.0">
? ?<title>Document</title>
</head>
<body>
? ?<!-- 行内元素:紧挨着排列,不能设置宽高,宽高有内容撑开 -->
? ?<a href="">我是链接</a>
? ?<a href="">我是链接2</a>
? ?<span>我是span</span>
</body>
</html>
特点:行内块元素之间可以在一行展示,可以设置宽高
<!DOCTYPE html>
<html lang="en">
<head>
? ?<meta charset="UTF-8">
? ?<meta name="viewport" content="width=device-width, initial-scale=1.0">
? ?<title>Document</title>
</head>
<body>
? ?<!-- 行内块:行内块元素之间可以在一行展示 -->
? ?<img src="images/cat.gif" alt="" width="100px">
? 111
? ?<img src="./boy.webp" alt="">
? 222
</body>
</html>
注意:
一般情况下,会在块元素中放行内元素,而不会在行内元素中放块元素
块元素中基本什么都能放
p元素中不能放任何块元素 特殊的存在
<body>
? ?<header>头部区域</header>
? ?<main>
? ? ? 主体
? ? ? ?<nav>导航栏</nav>
? ? ? ?<aside>侧边栏</aside>
? ?</main>
? ?<footer>底部</footer>
</body>
src是引入外部音频的路径,audio标签之间放音频加载失败后的文字内容
// <audio src="" controls> </audio>
controls->显示视频播放按钮
// <video src="" controls> </video>