有几种在页面输出html页面内容的较为快捷的方式（暂时发现三种）
1. <script type="text/html" style='display:block'>---不被解析的代码---</script>
2. <xmp>---不被解析的代码---</xmp>
3. <textarea style="'800px';height:300px;">---不被解析的代码---</textarea>
第一种：
<!-- 在script里定义为文本，
注意的是记得写display:block，不然没有效果的，直接输出，没有任何格式化效果 -->
<script type="text/html" style='display:block'>
<div class="banner-text p-5">
<div class="container">
<div class="banner-text-con">
<div>
<h1 style="color:;">html代码不被解析</h1>
</div>
</div>
</div>
</div>
</script>
第二种：
<xmp>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<h>交水电费是1</h>
<h>交水电费是2</h>
<h>交水电费是3</h>
<h>交水电费是4</h>
<h style="user-select:none;">交水电费是5</h>
<h>交水电费是6</h>
<hr>
<h1>体贴l题目1</h1>
<h2>体贴l题目2</h2>
<h3>体贴l题目3</h3>
<h4>体贴l题目4</h4>
<h5>体贴l题目5</h5>
<h6>体贴l题目6</h6>
<h7>体贴l题目7</h7>
<h8>体贴l题目8</h8>
<ul>li*3</ul>
</body>
</html>
</xmp>
第三种：
<textarea style="'800px';height:300px;">
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<h>交水电费是1</h>
<h>交水电费是2</h>
<h>交水电费是3</h>
<h>交水电费是4</h>
<h style="user-select:none;">交水电费是5</h>
<h>交水电费是6</h>
<hr>
<h1>体贴l题目1</h1>
<h2>体贴l题目2</h2>
<h3>体贴l题目3</h3>
<h4>体贴l题目4</h4>
<h5>体贴l题目5</h5>
<h6>体贴l题目6</h6>
<h7>体贴l题目7</h7>
<h8>体贴l题目8</h8>
<ul>li*3</ul>
</body>
</html>
<script>
</script>
</textarea>