HTML静态网页成品作业(HTML+CSS)—— 家乡成都介绍网页(4个页面)

崽子爱码

于 2024-06-13 08:00:48 发布

阅读量620

点赞数 4

分类专栏： html网页设计与制作学生HTML个人网页作业作品静态网页文章标签： html css 前端

本文链接：https://blog.csdn.net/weixin_42283461/article/details/139640694

版权

html网页设计与制作同时被 3 个专栏收录

118 篇文章 21 订阅

订阅专栏

静态网页

115 篇文章 0 订阅

订阅专栏

学生HTML个人网页作业作品

89 篇文章 17 订阅

订阅专栏

🎉不定期分享源码，关注不丢失哦

一、作品介绍

🏷️本套采用HTML+CSS，未使用Javacsript代码，共有4个页面。

二、作品演示

在这里插入图片描述

三、代码目录

在这里插入图片描述

四、网站代码

HTML部分代码

<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>成都</title>
	<link rel="stylesheet" href="./css/style.css">
</head>
<body>
	<div class="mid">
		<div class="nav">
			<a href="index.html">网站首页</a>
			<a href="lishi.html">成都历史</a>
			<a href="jingdian.html">成都景点</a>
			<a href="zaxianliuyan.html">在线留言</a>
		</div>
		<div class="banner">
			<img src="./images/banner.jpg" alt="">
		</div>
		
		
		<div class="m">
			<div class="t">成都简介</div>
			<div class="jianjie">
				<div class="jianjie_wenzi">
					成都市是中国首批国家历史文化名城之一，是古蜀文明的重要发源地，“天府之国”的中心，有着世界罕见的3000年城址不迁、2500年城名不改的历史特征。前316年，秦灭蜀，始设蜀郡并成都县。前311年，仿秦制重建城垣，为有文献记载的城市规划与建设之始，已有2300多年历史。汉因织锦业发达专设锦官管理，故有“锦官城”“锦城”之称，五代后蜀时遍种芙蓉，故别称“芙蓉城”“蓉城”。1921年，始设市政筹备处，1928年，正式设市。成都是重要的电子信息产业基地，成渝地区双城经济圈核心城市、区域经济中心、科技中心、世界文化名城和国际门户枢纽，西南地区的科技中心、商贸中心、金融中心和交通、通信枢纽，中国人民解放军西部战区机关驻地，是第31届世界大学生夏季运动会的举办地。2024年5月，入选承担数据标注基地建设任务城市名单。
				</div>
				<div class="jianjie_pic">
					<img src="./images/jianjie.jpeg" alt="">
				</div>
			</div>
			
			
			<div class="t">成都特色美食</div>
			<div class="meishi">
				<div class="meishi_1">
					<img src="./images/meishi_1.jpg" alt="">
					<div class="meishi_name">双流老妈兔头</div>
				</div>
				<div class="meishi_1">
					<img src="./images/meishi_2.png" alt="">
					<div class="meishi_name">夫妻肺片</div>
				</div>
				<div class="meishi_1">
					<img src="./images/meishi_3.jpeg" alt="">
					<div class="meishi_name">四川担担面</div>
				</div>
				<div class="meishi_1">
					<img src="./images/meishi_4.png" alt="">
					<div class="meishi_name">麻婆豆腐</div>
				</div>
				<div class="meishi_1">
					<img src="./images/meishi_5.jpeg" alt="">
					<div class="meishi_name">口水鸡</div>
				</div>
				<div class="meishi_1">
					<img src="./images/meishi_6.jpeg" alt="">
					<div class="meishi_name">冒菜</div>
				</div>
			</div>
		</div>
		
		<div class="footer">
			成都 版权所有
		</div>
	</div>
</body>
</html>