HTML静态网页成品作业(HTML+CSS)——动漫海绵宝宝介绍网页(5个页面)

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

文章目录


一、作品介绍

🏷️本套采用HTML+CSS,未使用Javacsript代码,共有5个页面

二、作品演示





三、代码目录

四、网站代码

HTML部分代码

c 复制代码
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="stylesheet" href="./css/style.css">
	</head>
	<body>
		
		
		
		
		<div class="box">
			<div class="header">
				<a href="index.html">网站首页</a>
				<a href="jianjie.html">作品简介</a>
				<a href="juese.html">角色介绍</a>
				<a href="tu.html">精美图片</a>
				<a href="shipin.html">精彩视频</a>
			</div>
			
			<div class="pic">
				<img src="./images/banner.jpg" alt="">		
			</div>
			
			<div class="main">
				<div class="main1">
					<p><img src="./images/1.jpeg" alt="" style="float: left;">
					<span style="display: inline-block;">海绵宝宝</span>
					<br>
						&nbsp;&nbsp;&nbsp;&nbsp;《海绵宝宝》(SpongeBob SquarePants)是一部由史蒂芬·海伦伯格原创,舍曼·科恩、沃特·杜赫、山姆·亨德森、保罗·蒂比特、沃尔特·道恩 [21] 等导演,汤姆·肯尼、比尔·法格巴克、罗杰·布帕斯等配音的美国喜剧动画,于1999年7月17日在尼克国际儿童频道开播。<br>
						&nbsp;&nbsp;&nbsp;&nbsp;央视少儿频道从2006年1月29日大年初一晚20:00开始播出。<br>
						&nbsp;&nbsp;&nbsp;&nbsp;《海绵宝宝》的故事情节主要围绕着主角海绵宝宝和他的好朋友派大星、邻居章鱼哥、上司蟹老板等生物展开,场景设定于太平洋海底,一座被称为比奇堡的城市。2005年1月30日,该片荣获第32届安妮奖授予的"最佳TV动画制作"奖。<br>
						
						&nbsp;&nbsp;&nbsp;&nbsp;这部动画除了固定描绘的卡通场景与人物之外,也会穿插一些真实的物件或人物:例如曾出演《海滩游侠》与《霹雳游侠》的大卫·哈塞尔霍夫,以本人的身份出演了几集。但海绵宝宝卡通的内容基本上与海洋知识无关,甚至夸大到完全不合乎科学与常识,例如海底生火、海底冲澡等,剧集内容也会时不时的嘲笑精致艺术和章鱼哥的劳工权益想法。
						
					</p>
				</div>
				
				<div class="main2">
					<img src="./images/11.png" alt="">
					<img src="./images/22.png" alt="">
					<img src="./images/33.png" alt="">
					<img src="./images/44.png" alt="">
				</div>
			</div>
			
			<div class="footer">
				
				海绵宝宝
				
			</div>
		</div>
	</body>
</html>

五、源码获取

🥇 ~ 关注我,点赞博文~ 每天带你涨知识!

🎁1.看到这里了就[点赞+好评+收藏]三连 支持下吧,你的「点赞,好评,收藏」是我创作的动力。

💙2.想要获取本文源码,点击前往吧

相关推荐
光影少年8 分钟前
vue2与vue3的全局通信插件,如何实现自定义的插件
前端·javascript·vue.js
As977_9 分钟前
前端学习Day12 CSS盒子的定位(相对定位篇“附练习”)
前端·css·学习
susu108301891111 分钟前
vue3 css的样式如果background没有,如何覆盖有background的样式
前端·css
Ocean☾13 分钟前
前端基础-html-注册界面
前端·算法·html
Dragon Wu15 分钟前
前端 Canvas 绘画 总结
前端
CodeToGym20 分钟前
Webpack性能优化指南:从构建到部署的全方位策略
前端·webpack·性能优化
~甲壳虫21 分钟前
说说webpack中常见的Loader?解决了什么问题?
前端·webpack·node.js
~甲壳虫25 分钟前
说说webpack proxy工作原理?为什么能解决跨域
前端·webpack·node.js
Cwhat26 分钟前
前端性能优化2
前端
熊的猫1 小时前
JS 中的类型 & 类型判断 & 类型转换
前端·javascript·vue.js·chrome·react.js·前端框架·node.js