写一个网页,左边列表包含多个类,每个类下包含多个子类,每个子类可以点击跳转
时间: 2024-05-24 14:15:52 浏览: 9
<!DOCTYPE html>
<html>
<head>
<title>类与子类列表</title>
</head>
<body>
<div id="list">
<ul>
<li><a href="#class1">Class 1</a>
<ul>
<li><a href="#class1-sub1">Class 1 - Subclass 1</a></li>
<li><a href="#class1-sub2">Class 1 - Subclass 2</a></li>
<li><a href="#class1-sub3">Class 1 - Subclass 3</a></li>
</ul>
</li>
<li><a href="#class2">Class 2</a>
<ul>
<li><a href="#class2-sub1">Class 2 - Subclass 1</a></li>
<li><a href="#class2-sub2">Class 2 - Subclass 2</a></li>
<li><a href="#class2-sub3">Class 2 - Subclass 3</a></li>
</ul>
</li>
<li><a href="#class3">Class 3</a>
<ul>
<li><a href="#class3-sub1">Class 3 - Subclass 1</a></li>
<li><a href="#class3-sub2">Class 3 - Subclass 2</a></li>
<li><a href="#class3-sub3">Class 3 - Subclass 3</a></li>
</ul>
</li>
</ul>
</div>
<div id="content">
<h2 id="class1">Class 1</h2>
<ul>
<li><a href="#class1-sub1">Class 1 - Subclass 1</a></li>
<li><a href="#class1-sub2">Class 1 - Subclass 2</a></li>
<li><a href="#class1-sub3">Class 1 - Subclass 3</a></li>
</ul>
<h2 id="class1-sub1">Class 1 - Subclass 1</h2>
<p>This is the content for Class 1 - Subclass 1.</p>
<h2 id="class1-sub2">Class 1 - Subclass 2</h2>
<p>This is the content for Class 1 - Subclass 2.</p>
<h2 id="class1-sub3">Class 1 - Subclass 3</h2>
<p>This is the content for Class 1 - Subclass 3.</p>
<h2 id="class2">Class 2</h2>
<ul>
<li><a href="#class2-sub1">Class 2 - Subclass 1</a></li>
<li><a href="#class2-sub2">Class 2 - Subclass 2</a></li>
<li><a href="#class2-sub3">Class 2 - Subclass 3</a></li>
</ul>
<h2 id="class2-sub1">Class 2 - Subclass 1</h2>
<p>This is the content for Class 2 - Subclass 1.</p>
<h2 id="class2-sub2">Class 2 - Subclass 2</h2>
<p>This is the content for Class 2 - Subclass 2.</p>
<h2 id="class2-sub3">Class 2 - Subclass 3</h2>
<p>This is the content for Class 2 - Subclass 3.</p>
<h2 id="class3">Class 3</h2>
<ul>
<li><a href="#class3-sub1">Class 3 - Subclass 1</a></li>
<li><a href="#class3-sub2">Class 3 - Subclass 2</a></li>
<li><a href="#class3-sub3">Class 3 - Subclass 3</a></li>
</ul>
<h2 id="class3-sub1">Class 3 - Subclass 1</h2>
<p>This is the content for Class 3 - Subclass 1.</p>
<h2 id="class3-sub2">Class 3 - Subclass 2</h2>
<p>This is the content for Class 3 - Subclass 2.</p>
<h2 id="class3-sub3">Class 3 - Subclass 3</h2>
<p>This is the content for Class 3 - Subclass 3.</p>
</div>
</body>
</html>
相关推荐
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)