Web大学生网页作业成品——动漫大耳朵图图网页设计与实现(HTML+CSS)（4个页面）

最新推荐文章于 2024-11-30 08:46:28 发布

爱码网页

最新推荐文章于 2024-11-30 08:46:28 发布

阅读量1.2k

点赞数 28

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

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

版权

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

236 篇文章

订阅专栏

静态网页

218 篇文章

订阅专栏

学生HTML个人网页作业作品

45 篇文章

订阅专栏

🎉🎉🎉 常见网页设计作业题材有**汽车、环保、明星、文化、国家、抗疫、景点、人物、体育、植物、公益、图书、节日、游戏、商城、旅游、家乡、学校、电影、动漫、非遗、动物、个人、企业、美食、婚纱、其他**等网页设计题目, 可满足大学生网页大作业网页设计需求都能满足你的需求。原始HTML+CSS+JS页面设计, web大学生网页设计作业源码，画面精明，排版整洁，内容丰富，主题鲜明，非常适合初学者学习使用。🎉🎉🎉

一、作品介绍 🔥

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

二、作品演示 ☁️

在这里插入图片描述

三、代码目录 🏠

在这里插入图片描述

四、网站代码 👿

HTML部分代码

<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>大耳朵图图</title>
	<link rel="stylesheet" href="./css/css.css">
</head>
<body>
	
	<div id="con">
		
		<div id="header">
			<ul>
				<li style="background-color: #17b1a8;"><a href="index.html">动漫首页</a></li>
				<li><a href="jianjie.html">动漫简介</a></li>
				<li><a href="juji.html">动漫剧集</a></li>
				<li><a href="zuopin.html">动漫作品</a></li>
			</ul>
		</div>
		
		<div id="banner" class="mt20">
			<img src="./img/banner.jpg" alt="">
		</div>
		
		
		<div id="main" class="mt20 main">
			<h3>动漫</h3>
			<p>《大耳朵图图》是由速达执导，叮当编剧，上海美术电影制片厂制作的电视动画片。该剧主要讲述了胡图图和小伙伴的成长故事。作品于2004年6月1日在中央电视台少儿频道首播，共计130集，每集12分钟左右。</p>
			<table class="mt20">
				<tr>
					<td>
						<img src="./img/1.png" alt="">
						<div>胡图图（图图）</div>
					</td>
					<td>
						<img src="./img/2.jpeg" alt="">
						<div>图图妈（张小丽）</div>
					</td>
					<td>
						<img src="./img/3.png" alt="">
						<div>图图爸（胡英俊）</div>
					</td>
					<td>
						<img src="./img/4.png" alt="">
						<div>小怪</div>
					</td>
				</tr>
				<tr>
					<td>
						<img src="./img/5.png" alt="">
						<div>图图爷爷</div>
					</td>
					<td>
						<img src="./img/6.png" alt="">
						<div>小美（于小美）</div>
					</td>
					<td>
						<img src="./img/7.png" alt="">
						<div>刷子（张帅子）</div>
					</td>
					<td>
						<img src="./img/8.png" alt="">
						<div>壮壮（丁大壮）</div>
					</td>
				</tr>
			</table>
		</div>
		
		
		<div id="footer">
			欢迎来到大耳朵图图乐园
		</div>
	</div>
	
</body>
</html>