html编写代码,使用有序列表、无序列表、列表嵌套实现“专业建设成果展示”页面
时间: 2024-09-29 22:07:26 浏览: 17
HTML是一种标记语言,常用于构建网页结构。为了创建一个“专业建设成果展示”页面,你可以使用`<ol>` (有序列表) 和 `<ul>` (无序列表) 来列出各项成果,同时利用嵌套列表实现层次结构。以下是简单的例子:
```html
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>专业建设成果展示</title>
<style>
/* 可以添加一些基本样式,如字体、间距等 */
</style>
</head>
<body>
<!-- 有序列表示例:按时间顺序展示 -->
<h2>主要建设成果</h2>
<ol>
<li>
<strong>项目一</strong>
<span>完成日期:2023年第一季度</span>
<p>详细描述...</p>
</li>
<li>
<strong>项目二</strong>
<span>完成日期:2023年第二季度</span>
<p>详细描述...</p>
</li>
</ol>
<!-- 无序列表示例:按类别分类展示 -->
<h2>特色成果</h2>
<ul>
<li><mark>创新技术:</mark>
<ul>
<li>技术A</li>
<li>技术B</li>
</ul>
</li>
<li><mark>人才培养:</mark>优秀学生名单... </li>
</ul>
</body>
</html>
```
在这个例子中,我们首先创建了一个标题,然后分别使用有序列表(`<ol>`)展示了按照时间排序的主建设项目,每个项目包含一个标题、完成日期和简短描述。接着,无序列表(`<ul>`)被用来按类别分组,比如创新技术和人才培养。