HTML基础

最新推荐文章于 2024-10-02 23:31:06 发布

march on_6

最新推荐文章于 2024-10-02 23:31:06 发布

阅读量568

点赞数 2

分类专栏：笔记文章标签： html 前端

本文链接：https://blog.csdn.net/yyh619/article/details/121372410

版权

笔记专栏收录该内容

5 篇文章 0 订阅

订阅专栏

概念

Hyper Text Markup Language 超文本标记语言

包括一系列标签，通过这些标签可以将网络上的文档格式统一，使分散的网络资源连接为一个逻辑整体。

基本知识

注释

注意：不参与代码运行：
快速生成：ctrl+?
格式：

 <!-- 注释 -->

标准文档结构

<!DOCTYPE html> ——文档声明

1.告诉浏览器当前文档使用的HTML标准是HTML5，如果不写文档声明，将导致浏览器进入怪异渲染模式。

2.<html></html>根元素，一个页面最多只能一个，并且该元素是所有其他元素的父元素或祖先元素，也可省略不写。

<html lang="en">

</html>

3.lang属性：全局属性

lang="cmn-hans" 汉语

4.文档头，不显示

<head> </head>

5.<meta> 告诉网页额外信息,（charset=" "，指定网页内容编码）

6. 文档标题

<title> Document</title>

7.文档体，显示内容

<body>内容</body>

元素

组成：

元素 = 起始标记+ 元素属性 +元素内容（要显示的东西） + 结束标记,例如：

<a href="想跳转的地址">点击此处</a>

注意：有一些元素没有结束标记，称之为空元素。两种写法：（主要看格式）

1.'''<meta charset="UTF-8">'''

2.'''<meta charset="UTF-8"/>'''

嵌套：

1. 不能相互嵌套，例如：<a> <b> </a> </b> 为错

2.可以包含嵌套，即一元素包含在另一元素内，例如：父子元素、祖先元素。
包含关系：

引入：块级元素：在显示时会独占一行。

行级元素： 在显示时不会独占一行。

标注：到了HTML5，已经弃用这种说法。

以前：块级元素可以包含行级元素，行级元素不可以包含块级元素，a元素（行级元素）除外

现在：元素的包含关系由元素的内容类别决定

容器元素中可以包含任何元素
a元素中几乎可以包含任何元素
某些元素有固定的子元素（ul>li，ol>li，dl>dt+dd）
标题元素和段落元素不能相互嵌套，并且不能包含容器元素

文本元素：

1.标题，head

h1~h6：表示1级标题~6级标题

2.段落，paragraphs

<p>内容</p>

引入：lorem——乱数假文，没有任何实际含义的文字，可放至p中填充段落。

形式：p*6>lorem100 表示：六段文字，每段100个单词

3.预格式化文本元素,pre

引入：空白折叠——在源代码中的连续空白字符（空格、换行、制表），在页面显示时，会被折叠为一个空格。

表示：在pre元素内部出现的内容，会按照源代码格式显示到页面上，即不出现空白折叠
功能：该元素通常用于在网页中显示一些代码
功能的本质：它有一个默认的css属性

4设置样式元素，span

 三原色包含：<span style="color:red">红</span>、<span style="color:green">绿</span>、<span style="color:blue">蓝</span>

注意：没有语义，仅用于设置样式。

a元素：

表示：超链接。

引入：href属性 1.形式：href=" "；2.通常表示：跳转地址

正确使用如下：（举例跳转到西安邮电大学信息网）

<a href="http://www.zfjw.xupt.edu.cn/jwglxt/xtgl/login_slogin.html"> 西邮教学信息网 </a>

跳转链接分类：

1. 普通链接

2. 锚链接（跳到页面的不同位置）

引入：id属性——全局属性，表示元素在文档中的唯一编号

实现锚链接操作：

a[href="#chapter$"]*6>{章节$}

((h2[id="chapter$"]>{章节$})+p>lorem100)*6

 <a href="#">返回顶部</a>

标注：$——自增符、+——表示两者为兄弟元素、*6——共同重复六次。

3. 功能链接（调到某个页面，具体需要相关应用实现）

引入：target属性1. 形式：target=" "：2.表示：跳转窗口位置。

- _self：在当前页面窗口中打开，默认值

- _blank: 在新窗口中打开

<a href="http://www.zfjw.xupt.edu.cn/jwglxt/xtgl/login_slogin.html" target="_blank" >

西邮教学信息网</a>

表示在新窗口中打开西邮教学信息网。

图片元素：

img元素：image缩写，空元素

<img src="图片地址来源" alt="如果图片失效出现的文字">

引入：src属性：source 地址
引入：alt属性：当图片资源失效时，将使用该属性的文字替代图片
和a元素联用
和map元素联用

map子元素：area;
举例如下：

<a><img usemap="#    "></a>

       <map name="    ">

       <area shape="   " coords="   " href="   " alt="   " target="   ">

属性标注：shpe——表示形状；coords——表示坐标：其余参考上面内容。

列表元素：

有序列表：ol: ordered list

子元素：li：list item

举例：

小吴去监狱吃牢饭分几步：
    <ol type="A">
        <li>对他人不正经</li>
        <li>被警察调查核实</li>
        <li>连人带犯罪物品统统收走</li>
    </ol>

无序列表:：ul：unordered list

子元素：li：list item

定义列表：dl: definition list

子元素：

--dt: definition title

--dd: definition description
容器元素:

含义：该元素代表一个块区域，内部用于放置其他元素
引入：div元素：没有语义，只是用来划分区域。
引入：语义化容器元素：

header: 通常用于表示页头，也可以用于表示文章的头部
footer: 通常用于表示页脚，也可以用于表示文章的尾部
article: 通常用于表示整篇文章
section: 通常用于表示文章的章节
aside: 通常用于表示侧边栏

标注：<用于正确划分区域，具体形式要用css实现>

语义化

每一个HTML元素都有具体的含义

举例：

a元素：超链接
p元素：段落
h1元素：一级标题

>>>语义化查询

标注：所有元素与展示效果无关，元素展示到页面中的效果有CSS控制。

重要：选择什么元素，取决于内容的含义，而不是显示出的效果。

<h1>我的标题</h1>
    <p>
        time and tide wait for no man!
    </p>
    <p>wo xiang shuo.......</p>

路径的写法

绝对路径：连接站外资源地址。

url地址：

协议名://主机名:端口号/路径

schema://host:port/path

(http\https\file)://(域名\IP地址):(可省；http--默认80；https--默认443)/路径

标注：当跳转目标和当前页面的协议相同时，可以省略协议名。

相对路径：连接站内资源。

./：表示当前资源所在的目录

../：表示上一级目录

总结

以上代码完成要用到VSCode（Visual Studio Code，通用编辑器，微软。）

这是第一次做，还有待完善。

这是我自己的练习总结

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <header>
        <ul>
        <a href="https://www.baidu.com/?tn=49055317_36_hao_pg" target="_blank"><li>网页</li></a>
        <a href="https://tieba.baidu.com/index.html" target="_blank"><li>贴吧</li></a>
        <a href="https://zhidao.baidu.com/" target="_blank"><li>知道</li></a>
        <li title="未完善">图片</li>
        <li title="未完善" >视频</li>
        <a href="https://map.baidu.com/search/%E5%85%A8%E5%9B%BD/@12959219.600003948,4825334.63000378,5z?querytype=s&wd=%E5%85%A8%E5%9B%BD&c=1&provider=pc-aladin&pn=0&device_ratio=2&da_src=shareurl"><li>地图</li></a>
        </ul>
    </header>
    <h1>瞧一瞧，看一看！</h1>
    <img src="./adv1.png" alt="图片走丢了">
    <article>
        <h1>ATTENTION</h1>
        <a href="#chapter1">今日要闻</a>
        <a href="#chapter2">昨日回顾</a>
        <a href="#chapter3">娱乐消息</a>
        <a href="#chapter4">美食报道</a>
        <a href="#chapter5">小李帮人</a>
        <a href="#chapter6">西邮大事</a>
    <section>
        <h2 id="chapter1">频道1</h2>
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Repellat rerum veniam, laborum fuga accusamus doloribus officiis iste ad placeat magni excepturi mollitia harum cupiditate laboriosam architecto exercitationem quam facere ab error. Non quia voluptates repellendus similique sapiente optio minus incidunt possimus tempora nemo. Veniam nulla fuga quas alias cumque eaque quasi saepe a qui impedit iusto id ab perferendis facilis nam laboriosam recusandae repudiandae corrupti esse ratione animi odit, incidunt tempore amet! Quis perspiciatis optio doloribus, eius porro corrupti placeat voluptatibus odit fuga. Sint laboriosam quidem distinctio, natus, nobis quos ipsa animi amet beatae, qui perspiciatis accusantium nam eligendi fugit minus repellat mollitia aperiam nihil libero nostrum. A vero voluptas ipsum mollitia reprehenderit placeat, saepe totam consequatur pariatur sed ullam nihil deserunt, officiis dolore dignissimos accusantium neque eveniet voluptates nesciunt delectus cum aut eius ipsa! Asperiores nihil qui autem cupiditate exercitationem doloremque ex. Debitis sed consequuntur corrupti ducimus beatae commodi sequi deserunt, id voluptas ratione libero, neque amet facilis adipisci. Nisi sunt hic voluptas id, culpa modi necessitatibus voluptate distinctio reiciendis veritatis ab vero dolores rerum neque nam provident quibusdam rem nostrum libero dignissimos sapiente quos laboriosam! Magni amet aliquid non odio debitis porro, ab vitae, aperiam hic deleniti tenetur! Perspiciatis tempore perferendis iure minus illo dolorum libero maiores earum quaerat adipisci est soluta dignissimos nemo, iste, sit nihil ab voluptatibus repellat eos nisi esse culpa recusandae fuga non? Molestiae cupiditate quae aliquid qui atque voluptas enim veritatis quod, tempore, officiis perspiciatis soluta. Unde delectus vel suscipit quo, et velit commodi ipsam aperiam architecto dignissimos, soluta, similique cupiditate facere atque nulla iusto a eveniet ab totam eum repellat optio excepturi. Praesentium incidunt quos sapiente ad autem ipsa explicabo officiis omnis, excepturi soluta, repellendus natus distinctio nesciunt aut. Debitis minima quisquam earum amet sapiente itaque quam assumenda! Dicta rem soluta magnam eaque excepturi magni ad deleniti quibusdam fugit omnis expedita sit voluptatibus sapiente, cupiditate ipsa vel exercitationem reiciendis fuga iste officiis, totam nihil? Excepturi nobis eum laboriosam necessitatibus expedita impedit possimus quaerat velit quibusdam sint rem unde, adipisci repudiandae nihil illum facere doloremque, officiis nesciunt aliquam obcaecati. Repellat tenetur id deleniti aperiam. Velit consequuntur animi, fugit eum harum cum ipsum reiciendis beatae assumenda alias adipisci perferendis, culpa at voluptate tempora quae numquam asperiores expedita recusandae vero. Expedita nulla sint modi cumque perspiciatis velit delectus ea molestias fugiat sunt iure corporis odio magnam ipsam nihil quam, exercitationem est recusandae, sapiente dolorum itaque eius ipsum impedit. Libero alias sed eum beatae a eos, architecto nulla, tempore vero obcaecati deserunt voluptates quidem explicabo inventore magni ad rem magnam consectetur. Mollitia repudiandae illum porro provident aperiam deserunt exercitationem nesciunt deleniti veniam voluptas sunt officia est alias, a facere quibusdam dolor eaque reiciendis perferendis accusantium magnam sequi. Minima aut voluptatibus nulla deleniti deserunt, voluptate magni cupiditate? Iure, nam perspiciatis! Similique deserunt enim vel dolore. Explicabo accusamus sequi porro molestias consequuntur ratione. Odio vero qui, distinctio in molestiae aliquam asperiores esse quaerat. Eligendi, iure obcaecati laboriosam beatae debitis harum delectus adipisci esse tempora reiciendis culpa cum voluptate.</p>
        <a href="#">return</a>
        <h2 id="chapter2">频道2</h2>
        <p>Quos libero cum doloremque aspernatur rem, nam non ex labore architecto odit est dignissimos voluptates eum esse facere porro modi quas totam illum blanditiis repudiandae ipsum eligendi accusamus! Consequatur quas excepturi adipisci eaque assumenda, laboriosam non deleniti quam sapiente laborum deserunt sed velit ratione! Blanditiis, tempore a asperiores placeat mollitia eum. Praesentium, veniam cum. Sunt quam pariatur doloremque eaque provident quos officia numquam labore culpa suscipit repudiandae animi excepturi tenetur voluptatibus assumenda neque non, facere porro est. Itaque quisquam eum necessitatibus repellat voluptas pariatur inventore qui quo ratione est reiciendis magni doloremque, maiores error. Fugit perspiciatis fuga, est porro consequuntur quod obcaecati pariatur atque impedit in reprehenderit ducimus, cumque animi unde reiciendis, perferendis accusantium consectetur! Iusto, voluptates libero deleniti porro labore eaque provident odio, eius repudiandae natus inventore. Cumque delectus maxime ab, odit doloribus vel asperiores fugiat quo aliquid quos. Necessitatibus eaque sit, velit nostrum excepturi officia ducimus, id similique amet dolore, sint animi vitae a est. Asperiores soluta iure quas, veniam sapiente numquam delectus repellendus adipisci nam deleniti, debitis voluptates earum unde mollitia doloremque nobis possimus, est porro amet dolorem ipsa excepturi doloribus? Natus magni tempora non ipsa, debitis perferendis, commodi similique voluptate quaerat, quos perspiciatis. Odit, quis. Amet sapiente id suscipit possimus doloribus voluptate odio, voluptates repellendus tenetur quibusdam voluptas et hic? Atque quis distinctio magni perferendis iusto obcaecati vero et exercitationem alias at magnam animi aspernatur nisi est reiciendis ut, laudantium error, quisquam porro, maxime blanditiis expedita. Itaque saepe odio dolor veritatis deserunt doloribus quasi illum in aliquam velit eveniet laudantium voluptatem, ut obcaecati repellat at explicabo aliquid mollitia reprehenderit molestias doloremque? Eaque omnis a ad autem debitis asperiores provident harum quibusdam odit deserunt pariatur laboriosam fugit amet dignissimos tempora, maiores nulla nam? Magni error atque soluta a rerum laboriosam provident nisi hic tempora inventore illum dolorum expedita, commodi tenetur exercitationem quasi temporibus quam, reiciendis consequuntur, nobis delectus reprehenderit maxime. Fugiat ullam inventore error odit voluptates? Natus corporis deserunt aspernatur fugit explicabo, recusandae illum accusantium architecto ab ex vero id odit? Laudantium atque consequuntur non accusantium omnis beatae ex necessitatibus facilis perferendis eos debitis cupiditate ad autem sunt incidunt deleniti voluptatibus, soluta eius odit aut inventore doloribus earum! Expedita, numquam. Praesentium voluptate accusamus molestiae dolorum? Magni nulla minus, neque id quos accusantium. Quaerat dolores mollitia quasi deserunt sunt culpa deleniti. Voluptates qui sit saepe impedit consectetur perspiciatis sequi officia. Corrupti quas, nam officia cum error minus aliquam blanditiis minima obcaecati fugit quibusdam iusto dolore harum fuga! Quisquam, explicabo modi aliquid vitae nam, molestiae repellendus iste voluptatem, accusamus dolore fuga id consequatur soluta earum et sapiente. Illo architecto cumque officia sed placeat ab, nam veniam accusantium perspiciatis ipsa delectus ut ratione eaque rerum esse? Odit repudiandae vel minima modi corporis tempore, atque unde obcaecati sapiente, placeat impedit reiciendis ullam asperiores natus consectetur doloremque adipisci! Ad labore libero ducimus nostrum, veritatis quod nobis alias rem illum in ullam praesentium expedita odit minima laudantium reiciendis, esse corporis velit! Atque quibusdam debitis minus corporis voluptate odio fugit magni id, ab velit!</p>
        <a href="#">return</a>
        <h2 id="chapter3">频道3</h2>
        <p>Ipsa omnis perspiciatis unde provident impedit ab molestias aliquam porro, suscipit repudiandae delectus et. Iure, ducimus assumenda voluptatibus laudantium perferendis esse ex officia expedita aliquid natus, aliquam quae. Repellat tenetur molestias, praesentium alias blanditiis sed. At blanditiis voluptatem ad autem commodi a est magni fugiat. Reprehenderit nisi laudantium maiores magni debitis quibusdam quas fugiat eveniet unde beatae, magnam placeat assumenda vero natus! Id non magni dicta minima nulla? Cumque animi esse necessitatibus vitae itaque tenetur voluptatibus ea unde, tempora accusantium, exercitationem similique consequatur, dignissimos doloribus quam dolorem expedita laudantium in voluptates inventore nisi nobis? Maiores at beatae itaque alias ipsa dolor obcaecati laborum harum nostrum illum modi ea perferendis ab soluta officiis architecto vero, et fugiat accusantium ullam, doloremque recusandae. Fuga numquam nobis unde voluptates corporis exercitationem eius inventore quod iure nam placeat officiis iusto quo fugiat eveniet explicabo commodi recusandae veniam impedit, magni et deleniti debitis ex dicta? Illo ea omnis saepe fugiat ipsa quibusdam dicta iure quasi amet vitae numquam soluta at sequi, sed dolor accusamus, magnam, architecto nostrum aperiam ducimus sapiente. Est optio inventore, harum, soluta accusantium neque sit numquam voluptates eos vel nostrum ullam perspiciatis beatae non labore sequi similique incidunt nam, eius voluptate aliquid. Maiores, consectetur voluptatem est tempora expedita consequuntur iste totam libero delectus voluptas atque sequi! Facere expedita asperiores quia repellat, cupiditate alias dolore tempore molestias voluptatibus autem, consectetur excepturi et repellendus laboriosam quasi quas numquam laborum quam! Impedit, rem! Doloremque officiis tenetur nam suscipit voluptates, repudiandae exercitationem reiciendis qui dolores veritatis, dicta voluptatibus accusamus beatae saepe fuga impedit similique unde. Dolores aut impedit saepe fugiat, consectetur beatae. Ipsa, asperiores obcaecati repudiandae iusto deleniti corporis amet. Incidunt nihil ipsa aperiam eos, beatae itaque sequi porro deserunt esse hic facilis nesciunt debitis distinctio accusantium reprehenderit iure! Maxime quo veniam non aperiam, harum vero hic sapiente rerum inventore consequatur cupiditate dolores sint obcaecati quis quia, fugiat necessitatibus numquam. Alias odio veniam ipsam velit molestias ab molestiae eaque assumenda sequi eos incidunt, similique autem, quidem ex eius ducimus. Ex placeat eum facilis. Quae veniam unde explicabo doloribus quibusdam. Officia earum, veniam cupiditate et repudiandae ut veritatis minima eius unde doloremque placeat aut, quod, voluptatibus sunt neque incidunt eveniet odit dolorem sed. Saepe molestiae dignissimos laborum architecto eaque deserunt? Id facere dicta dolores fugiat quae delectus, itaque sit vel laudantium, numquam quaerat enim magni sequi corrupti repudiandae ab maiores ad accusamus? Aspernatur accusantium dicta, dolorum iste labore voluptates eveniet laboriosam laudantium sapiente? Placeat earum eaque quis. Aspernatur asperiores, exercitationem, maxime, magni consequatur totam molestiae illo eaque laudantium placeat itaque. Nostrum laboriosam recusandae, dolorum iure eius dolore explicabo deleniti accusamus eos amet vel consectetur necessitatibus magnam eaque repudiandae ipsa rem, hic assumenda repellendus sint officia? Quibusdam illo id delectus pariatur excepturi quam cupiditate eius dicta cum, sint placeat perferendis cumque, debitis modi perspiciatis repellendus quo odit. Ratione non incidunt minus. Aut iure tempora ipsam nihil consectetur, eveniet laborum ratione? Laborum similique dolor dignissimos doloribus cum quod, tempora ipsum libero quos placeat reprehenderit! Quidem eligendi id inventore nostrum ex.</p>
        <a href="#">return</a>
        <h2 id="chapter4">频道4</h2>
        <p>Aliquid id odio beatae fugit deserunt non ratione excepturi dolore tempore vel natus animi, adipisci ab. Vel natus ducimus qui, error perspiciatis voluptatum accusantium esse, laboriosam, repellendus aut consectetur. Ullam architecto autem officia accusamus, alias nulla corrupti, expedita veritatis officiis exercitationem, animi nam omnis explicabo totam sint qui enim! Quaerat excepturi laudantium nam labore dolorem? At beatae quasi ad in corporis! Reprehenderit iure voluptatibus quisquam excepturi, assumenda optio, qui blanditiis laborum rem ex non fuga. Quod qui, quae fuga, officia dicta libero accusantium ratione obcaecati natus incidunt nostrum non. Odio obcaecati ullam eum facilis autem architecto ea itaque explicabo, labore nostrum illum tenetur sapiente quos commodi harum corrupti ipsa, facere dolores quidem! Cumque nostrum commodi qui minus recusandae et natus illo, beatae doloribus corporis voluptate laudantium quam tenetur deserunt illum eos odio inventore consequuntur odit. Sit aspernatur culpa cumque maiores recusandae illum sint quo sunt odio saepe minima architecto porro, nostrum maxime temporibus iusto expedita numquam debitis! Ullam laudantium cupiditate, quam minus quas vel pariatur deserunt harum officia nostrum quo sunt tempora eligendi exercitationem aperiam maiores nesciunt, vitae fuga error ea facere culpa accusantium distinctio? Delectus consequatur, iste animi inventore totam facere pariatur! Animi dolores quidem enim, totam iusto, repellendus explicabo libero ex sequi quam architecto perferendis sed. Voluptates iusto mollitia aperiam. Recusandae quis aperiam ipsam, vitae fuga reiciendis praesentium sit quod dignissimos, aut, aspernatur rem explicabo nisi? Voluptate hic doloremque, culpa commodi molestias tenetur, incidunt adipisci dolore temporibus animi repellendus aperiam sed nam soluta praesentium perspiciatis maxime. Culpa labore sit, libero velit corporis voluptate facilis molestiae fugit molestias, praesentium rem architecto commodi quidem error odio ipsam magnam vel dignissimos cum facere totam. Aspernatur, minima itaque architecto maiores, iusto ea ipsa totam odit ullam exercitationem consequuntur autem temporibus voluptatem, minus id cupiditate voluptatum distinctio. Dolorum nemo exercitationem mollitia alias? Voluptatum velit id animi sit? In, ipsam necessitatibus aut explicabo expedita nihil dolorem sunt perspiciatis distinctio quibusdam dolorum. Dicta tempore laboriosam autem nulla ex, omnis quia nisi maiores quod numquam praesentium esse corporis. Ipsum quas temporibus earum molestiae harum dicta veniam cumque delectus explicabo odit fugit laudantium inventore omnis porro vel nemo reiciendis obcaecati esse ipsa autem, impedit praesentium consequatur minima quidem. Possimus, eaque eos iure voluptates quod aut iusto eligendi debitis rem sunt id porro, quia nostrum similique et impedit soluta incidunt. Similique quaerat dolorem dolore accusantium quod, nisi sed esse sunt quidem tenetur illum consequuntur asperiores eius non reiciendis quos animi praesentium saepe. Officiis reiciendis ad, atque, corporis a voluptatum sequi labore omnis quae, iure nobis aut alias id eius. Ad qui repellat sit quas porro itaque ipsam facilis corrupti ipsa. Tenetur facilis quisquam perspiciatis vel, quidem aut possimus mollitia, reprehenderit soluta, inventore aliquid obcaecati numquam quis. Enim soluta cumque optio praesentium provident voluptate aut. Repellat eveniet in quo facere tenetur minus dicta officia, voluptate rem ipsum dolor libero repudiandae, iste officiis, beatae vitae placeat. Optio debitis deserunt ipsum maxime vero alias modi ut quasi, sint velit totam beatae assumenda expedita a ea vel, fugiat qui voluptatibus suscipit cum?</p>
        <a href="#">return</a>
        <h2 id="chapter5">频道5</h2>
        <p>Voluptate ducimus consequatur soluta inventore quidem fuga blanditiis eius porro quas dolor nisi distinctio architecto nostrum maxime, at minus ipsam incidunt? Ratione quod dolor doloremque, consequatur blanditiis officiis consequuntur accusamus, placeat sint nostrum veritatis, quos dicta cumque eveniet neque voluptatem a! Excepturi quasi id, nostrum rerum quas nam reprehenderit temporibus culpa est? Fugiat molestiae illum neque eum. Est neque esse ipsa assumenda itaque dicta veniam! Voluptas deserunt hic sunt adipisci numquam, dolorum ullam officia beatae itaque quia nisi laboriosam perferendis cumque sint voluptatum optio? Voluptatum, soluta quisquam obcaecati voluptatem, exercitationem dignissimos ad quasi porro laudantium ea atque perspiciatis dicta incidunt enim delectus recusandae, blanditiis amet ex nesciunt dolores magnam! Obcaecati, praesentium! Asperiores error, inventore ducimus cum pariatur quos necessitatibus quaerat rerum deleniti accusamus delectus. Vitae, eum fugiat commodi amet ipsum voluptas possimus error iste ipsam mollitia explicabo odio facere quod officia ipsa nesciunt, voluptates magnam. Deleniti, sed? Aspernatur cumque quas eligendi, ea officia repellat dolorem aliquid nisi corporis et necessitatibus modi. Consequuntur, quae. Corporis libero modi sapiente provident ipsam tenetur praesentium, blanditiis veritatis non illum. Odio inventore modi, ipsam sint blanditiis odit nihil recusandae quis sed natus, quibusdam obcaecati ullam porro impedit at praesentium dolorem maiores repudiandae consequatur, rem autem ratione. Labore harum pariatur, magnam consequatur rerum, quisquam repudiandae molestiae, eum aliquam autem illo vero eligendi cumque quas incidunt sequi iste reprehenderit optio itaque et ab. Maiores alias sit error tempora iusto! Minima omnis, non a consectetur modi labore porro dolore sequi exercitationem! Laudantium odio tempora qui quidem cum ullam facere, nemo beatae saepe omnis sapiente deserunt quos culpa repellendus rerum laboriosam quo, commodi iste earum est veniam dicta quaerat labore! Quasi consequatur eum ipsam? Deleniti voluptates, excepturi autem hic non numquam sunt illo voluptatum, assumenda, quidem alias deserunt. Voluptatibus impedit minus culpa repudiandae quaerat obcaecati incidunt et accusantium, asperiores architecto optio hic minima fugit libero explicabo, voluptate vel exercitationem velit! Aperiam quam distinctio rerum? Distinctio beatae est voluptas hic possimus dolore, magnam perspiciatis earum necessitatibus, nam reiciendis. Quis adipisci quidem possimus ea consectetur rem, dolores modi, dicta vel aliquam molestiae, ullam quam praesentium quos. Unde optio quae ipsa accusantium voluptatum quasi impedit illo sequi, sint cum expedita nisi reprehenderit natus neque id tenetur. Nobis, exercitationem optio. Consectetur enim quia voluptas quasi beatae quas alias reiciendis, libero molestiae a obcaecati eveniet quam nemo voluptatum hic perferendis vero! Itaque dolor ipsum mollitia beatae repellat aut doloremque odio a. Tenetur sed facilis aliquam, nisi eius a corporis alias maxime nostrum, similique modi voluptate veniam totam possimus dolorum itaque id recusandae praesentium dolore. Animi rem nam repellendus explicabo, neque distinctio voluptas rerum nihil odio eveniet doloremque, nostrum repellat omnis hic delectus! Blanditiis reiciendis veniam cupiditate fugiat quas adipisci, ullam magni alias nesciunt? Corrupti qui dicta blanditiis, quibusdam, accusantium maiores deserunt quisquam numquam, amet ut excepturi ab doloribus eum dolores error commodi nostrum! At, enim laboriosam placeat error cumque beatae sed aspernatur nam illo velit, ducimus voluptatibus doloribus accusantium, quas nesciunt itaque nostrum dolorum accusamus veniam harum ea magnam voluptatem. Quia quae repudiandae earum?</p>
        <a href="#">return</a>
        <h2 id="chapter6">频道6</h2>
        <p>Dolores ab sint expedita asperiores consequatur, perferendis ea, saepe placeat tempora laborum dolorum nihil! Ad corrupti minima saepe deleniti quod reiciendis, magnam dolor, asperiores eveniet, eaque quia at? Accusantium illo labore necessitatibus sit at totam magni rem harum sapiente porro esse, et molestiae in eligendi quis provident animi neque eum quibusdam, voluptas nemo. Nulla dicta eum nam laborum ipsam nisi quisquam ad numquam animi, accusantium similique neque dolor tempore deserunt, rem autem eius nostrum! In hic, necessitatibus fugit accusantium quasi id voluptas perspiciatis est, ducimus laboriosam sequi porro perferendis, totam unde magni debitis excepturi. Voluptates illum quia explicabo tenetur magnam facilis sed quas, perferendis autem adipisci enim odio distinctio at quo iste non aliquam, impedit exercitationem dolorum! Iusto eligendi cum perferendis atque voluptatem officia fuga aut, omnis, incidunt rem error voluptate quam rerum doloribus velit, ipsa laudantium. Pariatur tempore hic incidunt vel, explicabo eum ullam officiis voluptatem quia tempora ipsa atque facere sed! Deleniti dignissimos, tempore doloribus fugiat alias impedit vel vero blanditiis nisi odio esse possimus dicta inventore velit? Autem error officiis quae, repellendus dolor nobis obcaecati eos! Corporis accusamus repudiandae voluptate maiores, vitae tempora voluptas et accusantium quasi! Ex harum facilis neque magnam voluptatem accusamus reiciendis voluptatum ipsa sunt tempore nostrum nihil ducimus porro earum, saepe aut temporibus corrupti hic qui placeat autem. Porro, nesciunt placeat qui, delectus error soluta dolores assumenda commodi et asperiores animi. Corrupti velit dolorum architecto possimus quibusdam fuga harum perspiciatis, animi veniam ea saepe modi eveniet deserunt dolores hic facere laborum! Iusto error nihil voluptas quia, natus itaque accusantium, eos cum, ipsum omnis reprehenderit. Quibusdam omnis doloribus, aspernatur est hic nostrum adipisci neque sapiente optio magni minima, debitis quia velit aliquam officiis blanditiis reiciendis fuga. Nam recusandae incidunt earum, iure voluptas fugit consequatur natus ipsam, porro laudantium tenetur delectus ea animi, nisi maxime eius molestiae voluptates debitis sequi vero eum cum. Sed eaque vel, laboriosam nobis dolores commodi tenetur quia ipsam vitae vero earum natus corporis voluptatibus ipsa. Ipsam unde, recusandae ullam sint vero ab adipisci earum nesciunt placeat harum a perferendis tenetur aspernatur. Veritatis laborum suscipit officia id esse fugiat quaerat est, cumque commodi ipsam, accusamus maxime consequuntur molestias dolor qui numquam, quas expedita magnam perferendis nesciunt? Minima rem esse suscipit, molestias voluptas nihil corporis vel! Consequuntur est aperiam, repudiandae atque omnis debitis possimus! Numquam, suscipit. Nam, dicta deleniti! Culpa repellat dolores voluptatibus omnis inventore, asperiores optio voluptate cumque ea libero consequatur et quaerat quo a iste odio ipsa, quod architecto doloremque maxime perspiciatis. Sit facere facilis nobis deserunt est, quas cum perspiciatis? Repellendus soluta alias veritatis ullam id sed atque. Iure voluptatem asperiores ad fugit temporibus, distinctio officia accusamus! Sit culpa deleniti consectetur eius tempore voluptatem officiis, nam sequi atque, at quaerat itaque eos. Saepe assumenda optio placeat veniam ad eaque voluptatum doloremque quidem provident sint ex velit accusamus quam, magnam magni delectus dicta impedit. Ratione perspiciatis natus iste rem atque laboriosam? Aliquam, totam distinctio inventore a, ad ut aliquid quis, quibusdam fugiat doloremque possimus explicabo iure nobis cumque earum mollitia?</p>
        <a href="#">return</a>
    </section>  
    <a href="https://baike.baidu.com/item/%E5%A4%A7%E5%94%90%E4%B8%8D%E5%A4%9C%E5%9F%8E/7820254?fr=aladdin" target="_blank"><img src="./banner1.jpg" alt="图片走丢了" ><h1>了解更多美景信息</h1></a>
    <footer>
        <a href="./open.mp4" target="_blank"><img src="./banner2.jpg"></a>
        <h1>谢谢观看</h1>
        <a href="#">return</a>
    </footer>
    </article>
    
    
</body>
</html>

HTML完结