HTML期末作业-个人简历

最新推荐文章于 2024-06-15 14:29:33 发布
最新推荐文章于 2024-06-15 14:29:33 发布
阅读量3.3k 收藏 92
点赞数 6
分类专栏： 大学HTML+CSS+JavaScript期末作业 文章标签： javascript css html css3
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_41101110/article/details/117934159
版权

 HTML+CSS+JavaScript期末作业-个人简历，一个页面。

部分网页源码 


<!DOCTYPE html>

<html>

<head>

	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

	<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" />	

	<title>关于 我</title>

	<link rel="stylesheet" href="css/style.css" type="text/css" media="all" />

</head>

<body class="loading-process">

<div class="loading">

	<div class="loading-circle"></div>

	<div class="loading-avatar"><img src="images/avatar@2x.jpg" alt="" width="100" height="100"></div>

	<div class="loading-info">正在努力加载中...</div>

</div>

<div class="section-header">

	<div class="section">

		<nav class="nav" role="navigation">

			<ul>

				<li class="nav-about fade fade1"><a href="#about">关于</a></li>

				<li class="nav-works fade fade4"><a href="#works">作品</a></li>

				<li class="fade back-home"><a href="#top">首页</a></li>

				<li class="nav-skill fade fade2"><a href="#skill">能力</a></li>

				<li class="nav-contact fade fade3"><a href="#contact">联系</a></li>

			</ul>

		</nav>

	</div>

	<div class="nav-bg"></div>

</div>

<div class="home-bg">

	<img src="images/home-bg.jpg" alt="" width="1000" height="667">

</div>

<div class="section-wrap section-fristpage" data-slide="1"  >

	<div class="section">

		<div class="section-content">

			<p class="fade fade1">Hi，我是苏鑫波</p>

			<p class="fade fade2">欢迎光临我的主页</p>

			<p class="fade fade3">想了解更多，往下滚动哦 ^_^</p>

		</div>

		<a class="button2 scroll-tip fade fade4" data-slide="3" title="">向下滚动</a>

	</div>

</div>

<div id="about" data-slide="2" data-stellar-background-ratio="0.3" class="section-wrap section-about">

	<div class="section">

		<div class="about-content clearfix section-content">

			<div class="introli">

			  <span class="left_icon"><img class="bio-text bio-icon-1" src="images/bio-icon-1.png" data-stellar-ratio="0.7" ></span>

			  <span class="right_content "><img class="bio-text bio-text-1" src="images/bio-text-1.png" data-stellar-ratio="0.7" ></span>

			</div>

			<div class="introli">

			  <span class="left_icon"><img class="bio-text bio-icon-2" src="images/bio-icon-2.png" data-stellar-ratio="0.7" ></span>

			  <span class="right_content"><img class="bio-text bio-text-2" src="images/bio-text-2.png" data-stellar-ratio="0.7" ></span>

			</div>

			<div class="introli">

			  <span class="left_icon"><img class="bio-text bio-icon-3" src="images/bio-icon-3.png" data-stellar-ratio="0.7" ></span>

			  <span class="right_content"><img class="bio-text bio-text-3" src="images/bio-text-3.png" data-stellar-ratio="0.7" ></span>

			</div>



		</div>



	</div>

	<a class="button2 dark-button2 scroll-tip" style="background-position:0 -60px;" data-slide="3" title=""></a>

</div>

<div id="works" class="section-wrap section-works" data-slide="3" >

	<div class="section">

		<div class="works-content section-content">

			<h1>前端作品</h1>

			<div class="works-list clearfix">

				<div class="works-item first fade fade1">

						<img src="images/works/QQmusic.jpg" alt="" width="300" height="180">

						<div class="work-info">

							<h2>仿QQ音乐官网</h2>

							<p><strong>开发时间</strong>：2020年5月<br>

							<strong>工作详情</strong>：网页设计</p>

						</div>

					</a>

				</div>

				<div class="works-item fade fade2">

						<img src="images/works/banban.png" alt="" width="300" height="180">

						<div class="work-info">

							<h2>瓣瓣首页</h2>

							<p><strong>开发时间</strong>：2020年5月<br>

							<strong>工作详情</strong>：页面设计及前端制作。</p>

						</div>

					</a>

				</div>

				<div class="works-item fade fade3">

						<img src="images/works/Microsoft.png" alt="" width="300" height="180">

						<div class="work-info">

							<h2>微软中国</h2>

							<p><strong>开发时间</strong>：2020年6月<br>

							<strong>工作详情</strong>：页面设计及前端绑定和制作。</p>

						</div>

					</a>

				</div>

				<div class="works-item fade fade2">

					<a>

						<img src="images/works/wxshop.jpg" alt="" width="300" height="180">

						<div class="work-info">

							<h2>微信商城</h2>

							<p><strong>开发时间</strong>：2014年05月<br>

							<strong>工作详情</strong>：前端页面开发及绑定。</p>

						</div>

					</a>

				</div>

			</div>

			<a class="more-link" href="page/product">查看更多</a>

		</div>

		<a class="button2 scroll-tip fade fade4" data-slide="4" title="">向下滚动</a>

	</div>

</div>

<div id="skill" class="section-wrap section-skill" data-slide="4">

	<div class="section">

		<div class="skill-content section-content">

			<h1>相关技能</h1>

			<ul>

				<li class="fade fade1">熟练掌握语义化的 HTML 和具有兼容性的 CSS 模式，熟练手写符合 W3C 标准的结构和代码。</li>

				<li class="fade fade2">对 HTML5 和 CSS3 有一定了解。</li>

				<li class="fade fade3">了解MySQl，有一定 PHP 后端相关知识。</li>

				<li class="fade fade4">对 Linux 有一定了解。</li>

				<li class="fade fade2">喜欢接触新事物，有一定的自学能力。</li>

			</ul>

		</div>

	</div>

	<a class="button2 scroll-tip fade fade4"  data-slide="5" title="">向下滚动</a>

</div>

<div id="contact" class="section-wrap section-contact" data-slide="5">

	<div class="section">

		<div class="contact-content clearfix section-content">

			<h1>联系本人</h1>

			<div class="left">

				<div class="contact-ways fade fade1">

					<h2>社交网络</h2>

					<ul>

						<li>邮箱：913349988@qq.com</li>

						<li>Q Q ：913349988</li>

					</ul>

				</div>

				<div class="contact-info fade fade2">

				</div>

			</div>

		</div>

	</div>

	<a class="button2 button2-2-top scroll-tip" id="gototops" data-slide="1" href="#top" style="background-position: -60px 0;width:80px;height:80px;" title=""></a>

</div>



<div class="overlay"></div>

<div class="state-indicator"></div>



<script type="text/javascript" src="js/min.js"></script>

<script src="js/global.js"></script>

<script src="js/waypoints.min.js"></script>

<script src="js/js.js"></script>

<script src="js/stellar.min.js"></script>



</body>

</html>

部分网页截图 

IT--精英联盟
关注
  • 6
    点赞
  • 踩
  • 92
    收藏
    觉得还不错? 一键收藏
  • 7
    评论
专栏目录
HTML5期末大作业：动漫网站设计——福五鼠动漫(6页)带轮播特效 高质量代码 HTML+CSS+JavaScript 毕设网页设计HTML
qq_365392777
10-14 2057
HTML5期末大作业：动漫网站设计——福五鼠动漫(6页)带轮播特效 HTML+CSS+JavaScript 大学生毕设网页设计HTML 学生网页课程设计期末作业下载 web网页设计制作成品 常见网页设计作业题材有 个人、 美食、 公司、 学校、 旅游、 电商、 宠物、 电器、 茶叶、 家居、 酒店、 舞蹈、 动漫、 明星、 服装、 体育、 化妆品、 物流、 环保、 书籍、 婚纱、 军事、 游戏、 节日、 戒烟、 电影、 摄影、 文化、 家乡、 鲜花、 礼品、 汽车、 其他 等网页设计题目, A+水平
html期末作业网站设计-web个人简历网站
12-27
在这个"html期末作业网站设计"中，我们可以预见到学生们将利用HTML来构建一个web个人简历网站，展示他们的技能和经历。 首先，HTML的基础元素包括标签、属性和内容。标签是HTML的核心，它们告诉浏览器如何显示页面...
【大学生期末大作业】HTML+CSS+JavaScript — 模仿博客网站设计（Web）
好好读书
03-25 7777
JavaScript课程期末作业，👨‍🎓学生HTML动态网页基础水平制作，页面排版干净简洁。模仿博客设计风格，精简优化，使用 HTML+CSS+JavaScript 页面布局设计,大学生网页设计作业源码Web，画面精明，排版整洁，内容丰富，主题鲜明，适合初学者、大学生、期末综合作业实践等学习使用, 实例全面，有助于同学的学习，本文将详细介绍如何从头开始设计个人网站并将其转换为代码的过程来实践设计，思路+过程+代码。一直走在路上🏔。
JS期末大作业
陈铭泉的博客
07-05 1922
陈氏餐厅期末大作业
144.大学生期末大作业 网页实例 web前端网页制作html+css+js
A240307的博客
05-01 3547
蓝色响应式的网络建设设计公司网页实例，应用html+css+js，应用 Div、导航条、图片轮翻效果、鼠标滑动特效、左侧浮动返回顶部图标样式、留言表单、搜索等。适用于大学生网页课程作业设计、公司网页制作等，供大家参考。
web前端期末结课大作业 html+css+javascript网页设计实例 企业网站制作
11-15
期末结课大作业 html+css+javascript网页设计实例 企业网站制作，资源里面有网页的HTML文件、CSS文件、JAVASCRIPT文件和网页中的图片文件，用于大学web网页课程设计参考以及相关从业人员参考学习
web前端期末大作业：JavaScript大作业——福五鼠动漫网页制作(6页)带轮播图效果 学生个人单页面网页作业 学生网页设计成品 静态HTML网页单页制作
wx___BJ050106的博客
01-01 1798
网页作品编辑作品下载后可使用任意HTML编辑软件（如：`DW、HBuilder、NotePAD 、Vscode 、Sublime 、Webstorm、 Notepad++ 等任意HTML软件编辑修改网页） 网页作品技术：Div+CSS、鼠标滑过特效、Table、导航栏效果、banner、表单、二级三级页面等，视频、 音频元素 、Flash，同时设计了logo（源文件），基本期末作业所需的知识点全覆盖。
html个人简历.rar
10-24
HTML是一种标记语言，它是网页设计的基础，用于构建和呈现网页内容。...对于学习Web开发的学生来说，这样的HTML简历制作也是很好的实践和期末大作业项目，能够提升他们对HTML和CSS的理解和应用能力。
静态网页设计期末大作业HTML+Bootstrap，网页版个人简历
02-09
在本项目中，学生将利用HTML和Bootstrap框架来创建一个静态网页版的个人简历，作为其在静态网页设计课程中的期末大作业。这个任务旨在帮助学生掌握基础的网页构建技术，提升网页布局和响应式设计的能力。以下是相关...
静态网页设计期末大作业HTML+CSS的Web前端静态个人简历网页设计.zip
02-09
静态网页设计期末大作业HTML+CSS的Web前端静态个人简历网页设计.zip 95分以上必过项目，代码完整下载即用，确保可以运行。 静态网页设计期末大作业HTML+CSS的Web前端静态个人简历网页设计.zip 95分以上必过项目，...
html简洁漂亮的个人简历,个人主页，个人简介网页版源码（高分作业）
最新发布
06-16
html简洁漂亮的个人简历,个人主页，个人简介网页版源码（高分作业）本资源中的源码都是经过本地编译过可运行的，评审分达到95分以上。资源项目的难度比较适中，内容都是经过助教老师审定过的能够满足学习、使用需求...
HTML5+CSS3+JavaScript 网页设计与制作期末综合大作业 杭帮美食五个页面（附完整答案和学生用要求及素材）
03-29
网页主题：杭帮美食 页面介绍：首页、杭帮菜概况、视频教程、图片欣赏、会员注册
2021最新写 HTML期末大作业-我的个人主页
06-24
本源码共8 个页面，包括首页、个人简介、爱好、相册、留言等页面，包含知识 html，css、js 本作业界面整洁，层次结构分明，带分页、背景音乐、swf视频、滚动、js控制更多隐藏
学生个人简介html网页
11-24
简单学生个人简介网页，适合新手学习，交作业参考。采用div+css布局 简单学生个人简介网页，适合新手学习，交作业参考。采用div+css布局 简单学生个人简介网页，适合新手学习，交作业参考。采用div+css布局
HTML个人简历
10-08
利用HTML5语言编写的个人简历有兴趣的的朋友可以下载下来学习一下
HTML个人资料mooc风格
07-20
mooc风格的个人资料界面，有css. -----------------------------------------------
大学生HTML期末大作业——HTML+CSS+JavaScript个人网站
...
06-15 1395
HTML+CSS+JS【个人网站】网页设计期末课程大作业 web前端开发技术 web课程设计 网页规划与设计
【JavaScript期末大作业】基于html+css+javascript+jquery+bootstrap票务销售系统管理后台模板
qq_524614081的博客
12-09 72
📂文章目录一、👨‍🎓网站题目二、✍️网站描述三、📚网站介绍四、💠网站演示五、⚙️ 网站代码🧱HTML结构代码六、🥇 如何让学习不再盲目七、🎁更多干货 ❤ 【作者主页——🔥获取更多优质源码】 ❤ 【学习资料/简历模板/面试资料/ 网站设计与制作】 ❤ 【web前端期末大作业——🔥🔥毕设项目精品实战案例】 一、👨‍🎓网站题目 🧑‍🎓 学生管理系统网页设计 、OA管理系统、后台管理模板、智能停车系统、等网站的设计与制作。 二、✍️网站描述 🏷️HTML网页设计，采用DIV+CSS布局，共有多个页面
html5网页设计作业-刘德华个人简介网页设计成品模板
猿猿网页设计
03-12 749
html5网页设计作业-刘德华个人简介网页设计成品模板
html5仿应用宝软件app下载页面模板单页源码
05-15
HTML5仿应用宝软件App下载页面模板是一个非常实用的单页源码模板，可以让你快速开发出一个美观且功能齐全的应用下载页面。这个模板包含了一些非常重要的功能和特点，可以让你的应用下载页面更加出色： 1、 响应式设计： 这个模板采用了响应式设计，在各种设备和浏览器上都能良好的呈现页面，无论是在PC端还是移动端浏览器上体验都很棒。 2、 清晰简洁的页面布局： 该模板采用的是一种简洁清晰的页面布局，并通过视觉层次的设计优化页面结构，以提高用户体验。 3、 多种下载方式： 针对不同用户的需求，该模板提供了多种下载方式，包括应用商店下载链接、直接下载应用安装包等方式，方便用户选择自己需要的下载方式。 4、 强大的交互和动效特效： 该模板提供了丰富的交互和动效特效，包括页面滚动特效、轮播图切换、移动端手势效果等，使得页面看起来更加鲜活动感。 总之，这个HTML5仿应用宝软件App下载页面模板单页源码是一个非常不错的选项，它能够让你快速建立一个出色的应用下载页面，同时提升用户体验和下载效果。无论你是创业者、开发者还是设计师都值得拥有它。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 7
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值