提供了编程的基础技术教程

zl程序教程

您现在的位置是：首页 >  前端

当前栏目

HTML:课堂练习5-3唐代诗歌目录页面设计

HTML 设计 页面 目录
2023-09-27 14:22:47 时间

题目要求：

在这里插入图片描述
参考代码：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="author" content="huyiwei">
		<meta name="generator" content="HBuilder X"></meta>
		<title>唐代诗歌目录</title>
		<style type="text/css">
			ul{
				list-style-type: none;
			}
		</style>
	</head>
	<body bgcolor="pink">
		<h3>
			<a name = "唐代诗歌目录">唐代诗歌目录</a>
		</h3>
		<ol>
			<li>
				<a href="#春晓">春晓</a>
			</li>
			<li>
				<a href="#静夜思">静夜思</a>
			</li>
			<li>
				<a href="#望庐山瀑布">望庐山瀑布</a>
			</li>
		</ol>
		<br><br><br><br><br><br>
		<h3>
			<a name = "春晓">春晓</a>
		</h3>	
		<ul>
			<li>春眠不觉晓，</li>
			<li>处处闻啼鸟。</li>
			<li>夜来风雨声，</li>
			<li>花落知多少？</li>
		</ul>
		<h4 align = "right">
			<a href="#唐代诗歌目录">返回</a>
		</h4>
		<br><br><br><br><br><br>
		<h3>
			<a name = "静夜思">静夜思</a>
		</h3>
		<ul>
			<li>床前明月光，</li>
			<li>疑是地上霜。</li>
			<li>举头望明月，</li>
			<li>低头思故乡。</li>
		</ul>
		<h4 align = "right">
			<a href="#唐代诗歌目录">返回</a>
		</h4>
		<br><br><br><br><br><br>
		<h3>
			<a name = "望庐山瀑布">望庐山瀑布</a>
		</h3>
		<ul>
			<li>日照香炉生紫烟，</li>
			<li>遥看瀑布挂前川。</li>
			<li>飞流直下三千尺，</li>
			<li>疑是银河落九天。</li>
		</ul>
		<h4 align = "right">
			<a href="#唐代诗歌目录">返回</a>
		</h4>
	</body>
</html>

样式效果：

在这里插入图片描述

相关文章