学生HTML个人网页作业作品 简单的IT技术个人简历模板html下载 简单的学生网页作业源码 静态HTML个人博客主页

发布于：2023-01-04 ⋅ 阅读:(250) ⋅ 点赞:(0)

📂文章目录

👨‍🎓网页题目

🧑个人网页设计、🙋‍♂️个人简历制作、👨‍💼简单静态HTML个人网页作品、👨‍🏭个人介绍网站模板 、等网站的设计与制作。

✍️网页描述

⭐个人网页设计网站模板采用DIV CSS布局制作，网页作品有多个页面，如 :个人介绍（文字页面）、我的作品（图片列表）、个人技能（图文页面）、在线留言（表单页面）CSS样式方面网页整体采用左右布局结构，制作了网页背景图片，导航区域每个导航背景色不同，导航背景色与页面背景呼应。

🌐网页效果

在这里插入图片描述

🔧 代码实现

🧱HTML结构代码




<html>
		<head>
		<meta charset="utf-8">
		<meta name="keywords" content="Java开发工程师，简历模板，在线制作，免费下载" />
		<meta name="description" content="本人做事稳重，对待工作认真，责任心较强，待人真诚，善于沟通，时刻保持学习，积极拥抱变化。喜

欢java 开发，具备一定的软件分析、设计、开发和应用能力，拥有较强的学习能力与团队精神，能够

很快的适应工作环境。" />
		<title>Java开发工程师简历模板免费在线制作 - 五百丁简历</title>
		<link rel="stylesheet" type="text/css" href="css/style.css" />
		<link rel="stylesheet" type="text/css" href="css/new.css" media="all"/>
		<link rel="stylesheet" href="css/bootstrap.min.css?v=2159" />
		<link rel="stylesheet" href="css/zxbj_base.css?v=2818" />
		<link rel="stylesheet" href="css/jm0203.css" />
		
</head>

<body style="height:auto;background:#f8f8f8;">
<div class="n_dispage_jm">
          <div class="n_dispage_jm_in resetEditStyle"> 
    
    
    
    <div class="baseStyle clearfix jm0203_j1" id="resume_body">
              <div class="divLeft clearfix" id="bar"> 
        
        
        
        <div data-toggle="modal" data-target="#myModalHead" class="headDiv" id="resume_head"> <span class="headNotice">点击替换头像</span> <img class="resume_head" src="images/default_head.png" height="200" /> </div>
        <div id="bar_sort"></div>
        
        
        
        <div class="msgDiv positonDiv resume_add_area resume_sort" id="resume_msg">
                  <ul class="editBtn">
            <li class="btnMove" style="cursor:move;"data-placement="top" title="拖动调整上下位置"></li>
            <li class="btnPlus resume_add" for-key="resume_msg" data-placement="bottom" title="添加一项"></li>
          </ul>
                  <div class="baseAge baseMsg baseDel" id="resume_age">
            <div class="delete resume_hidden" for-id="resume_age"></div>
            <a class="resume_icon_diy icon wbdfont" for-id="age" style="font-size:none"></a>
            <input class="baseBorder resume_msg resume_lang_age" for-key="age" placeholder="年龄/生日" value="24岁" />
          </div>
                  <div class="baseAddress baseMsg baseDel" id="resume_address">
            <div class="delete resume_hidden" for-id="resume_address"></div>
            <a class="resume_icon_diy icon wbdfont" for-id="address" style="font-size:none"></a>
            <input class="resume_msg baseBorder resume_lang_address" for-key="address" placeholder="xx地址" value="广东省广州市" />
          </div>
                  <div class="baseMobile baseMsg baseDel" id="resume_mobile">
            <div class="delete resume_hidden" for-id="resume_mobile"></div>
            <a class="resume_icon_diy icon wbdfont" for-id="mobile" style="font-size:none"></a>
            <input class="resume_msg baseBorder resume_lang_mobile" for-key="mobile" placeholder="xx电话" value="13588888888" />
          </div>
                  <div class="baseEmail baseMsg baseDel" id="resume_email">
            <div class="delete resume_hidden" for-id="resume_email"></div>
            <a class="resume_icon_diy icon wbdfont" for-id="email" style="font-size:none"></a>
            <input class="resume_msg baseBorder resume_lang_email" for-key="email" placeholder="电子邮箱" value="service@500d.me" />
          </div>
                </div>
        
        
        
        <div class="skillDiv positonDiv resume_add_area resume_graph resume_sort" id="resume_graph">
                  <ul class="editBtn">
            <li class="btnMove" style="cursor:move;"data-placement="top" title="拖动调整上下位置"></li>
            <li class="btnPlus resume_add" for-key="resume_graph" data-placement="bottom" title="添加一项"></li>
            <li class="btnDel resume_hidden" for-id="resume_graph" data-placement="bottom" title="隐藏该模块"></li>
          </ul>
                  <ul class="skillUl resume_append_area">
            <li class="baseDel resume_delete_area resume_graph_item">
                      <div class="skillTitle">
                <input class="resume_value baseBorder" for-key="resume_skill_graph" placeholder="填写你的技能名称" value="Java" />
              </div>
                      <span><i class="resume_line" for-id="resume_skill_graph" style="width:128px;border-top-style:solid;border-top-width:8px;"></i></span>
                      <div class="delete resume_delete"></div>
                    </li>
            <li class="baseDel resume_delete_area resume_graph_item">
                      <div class="skillTitle">
                <input class="resume_value baseBorder" for-key="53815fa3293e57988958e27243b16870" placeholder="填写你的技能名称" value="C++" />
              </div>
                      <span><i class="resume_line" for-id="53815fa3293e57988958e27243b16870" style="width:128px;border-top-style:solid;border-top-width:8px;"></i></span>
                      <div class="delete resume_delete"></div>
                    </li>
            <li class="baseDel resume_delete_area resume_graph_item">
                      <div class="skillTitle">
                <input class="resume_value baseBorder" for-key="0fb2de17b37fd50c14ccda4d9b96bd94" placeholder="填写你的技能名称" value="mysql" />
              </div>
                      <span><i class="resume_line" for-id="0fb2de17b37fd50c14ccda4d9b96bd94" style="width:128px;border-top-style:solid;border-top-width:8px;"></i></span>
                      <div class="delete resume_delete"></div>
                    </li>
            <li class="baseDel resume_delete_area resume_graph_item">
                      <div class="skillTitle">
                <input class="resume_value baseBorder" for-key="0bab43524d96b1b58129f46097ee14b7" placeholder="填写你的技能名称" value="jsp" />
              </div>
                      <span><i class="resume_line" for-id="0bab43524d96b1b58129f46097ee14b7" style="width:128px;border-top-style:solid;border-top-width:8px;"></i></span>
                      <div class="delete resume_delete"></div>
                    </li>
          </ul>
                </div>
        
        
        
        <div class="hobbyDiv positonDiv resume_add_area resume_icon resume_sort" id="resume_icon">
                  <ul class="editBtn">
            <li class="btnMove" style="cursor:move;"data-placement="top" title="拖动调整上下位置"></li>
            <li class="btnPlus resume_add" for-key="resume_icon" data-placement="bottom" title="添加一项"></li>
            <li class="btnDel resume_hidden" for-id="resume_icon" data-placement="bottom" title="隐藏该模块"></li>
          </ul>
                  <dl class="clearfix">
            <dt><span>
              <div class="resume_lang_hobby">兴趣爱好</div>
              </span></dt>
            <dd class="resume_append_area">
                      <div class="hobbyicon baseDel resume_delete_area resume_icon_item"> <a class="resume_icon_diy icon wbdfont" for-id="resume_hobby_icon" style="font-size:none"></a> <span class="hobbyTitle">
                        <input class="resume_value baseBorder" for-key="resume_hobby_icon" placeholder="兴趣爱好" value="篮球" />
                        </span>
                <div class="delete resume_delete"></div>
              </div>
                      <div class="hobbyicon baseDel resume_delete_area resume_icon_item"> <a class="resume_icon_diy icon wbdfont" for-id="9eff2552587f9d5970ebab85696208dc" style="font-size:none"></a> <span class="hobbyTitle">
                        <input class="resume_value baseBorder" for-key="9eff2552587f9d5970ebab85696208dc" placeholder="兴趣爱好" value="足球" />
                        </span>
                <div class="delete resume_delete"></div>
              </div>
                      <div class="hobbyicon baseDel resume_delete_area resume_icon_item"> <a class="resume_icon_diy icon wbdfont" for-id="162b8459a4a82554da5e6a12c2f21c8f" style="font-size:none"></a> <span class="hobbyTitle">
                        <input class="resume_value baseBorder" for-key="162b8459a4a82554da5e6a12c2f21c8f" placeholder="兴趣爱好" value="游戏" />
                        </span>
                <div class="delete resume_delete"></div>
              </div>
                      <div class="hobbyicon baseDel resume_delete_area resume_icon_item"> <a class="resume_icon_diy icon wbdfont" for-id="b3cf5ddaec3cbe67762a2d8d3df17f17" style="font-size:none"></a> <span class="hobbyTitle">
                        <input class="resume_value baseBorder" for-key="b3cf5ddaec3cbe67762a2d8d3df17f17" placeholder="兴趣爱好" value="摄影" />
                        </span>
                <div class="delete resume_delete"></div>
              </div>
                    </dd>
          </dl>
                </div>
      </div>
              <div class="divRight clearfix resume_main" id="foo"> 
        
        
        
        <div class="nameDiv positonDiv" id="resume_name">
                  <h1>
            <div class="resume_msg baseBorder resume_notice resume_lang_name" notice-key="msg" for-key="name" for-value="html" contenteditable="true">五百丁</div>
          </h1>
                  <h2>
            <div class="resume_msg baseBorder resume_notice resume_lang_job" notice-key="job" for-key="job" for-value="html" contenteditable="true">求职目标：Java开发工程师</div>
          </h2>
                </div>
        <div id="foo_sort"></div>
        
        
        
        <div class="eduDiv baseItem positonDiv resume_item resume_add_area resume_sort resume_notice" notice-key="edu" id="resume_edu" for-key="edu">
                  <ul class="editBtn">
            <li class="btnMove" style="cursor:move;"data-placement="top" title="拖动调整上下位置"></li>
            <li class="btnPlus resume_add" for-key="resume_item" data-placement="bottom" title="添加一项"></li>
            <li class="btnDel resume_hidden" for-id="resume_edu" data-placement="bottom" title="隐藏该模块"></li>
          </ul>
                  <dl>
            <dt> <a class="resume_icon_diy icon wbdfont" for-id="edu" style="font-size:none"></a> <span>
              <div class="resume_lang_edu">教育背景</div>
              <div class="Border resume_line" for-id="edu" style="width:668px;border-top-style:solid;border-top-width:2px;"></div>
              </span> </dt>
            <dd class="resume_append_area">
                      <div class="baseContent baseDel resume_item_items resume_delete_area">
                <div class="delete resume_delete"></div>
                <div class="conTitle"> <span class="conTitle_time">
                  <div class="resume_time baseBorder" contenteditable="true">2008.09-2012.07</div>
                  </span> <span class="conTitle_company">
                  <div class="resume_unit baseBorder" contenteditable="true">吉林大学</div>
                  </span> <span class="conTitle_post">
                  <div class="resume_job baseBorder" contenteditable="true">计算机科学与技术（本科）</div>
                  </span> </div>
                <div class="baseDel_ resume_delete_area_">
                          <div class="delete_ resume_delete_"></div>
                          <div class="conDisc baseBorder baseDel resume_value" contenteditable="true" data-toggle="tooltip" data-placement="top" title="复制粘贴文字请右键-粘贴为纯文本">
                    <p>主修课程</p>
                    <p>c++,java,数据结构，数据库概论，数据库应用，数字逻辑，汇编语言，EDA技术，Windows环境编程实践，操作系统，计算方法，J2EE，计算机网络，Linux操作系统， 计算机图形学，编译原理，微机接口技术。</p>
                  </div>
                        </div>
              </div>
                    </dd>
          </dl>
                </div>
        
        
        
        <div class="workDiv baseItem positonDiv resume_item resume_add_area resume_sort resume_notice" notice-key="work" id="resume_work" for-key="work">
                  <ul class="editBtn">
            <li class="btnMove" style="cursor:move;"data-placement="top" title="拖动调整上下位置"></li>
            <li class="btnPlus resume_add" for-key="resume_item" data-placement="bottom" title="添加一项"></li>
            <li class="btnDel resume_hidden" for-id="resume_work" data-placement="bottom" title="隐藏该模块"></li>
          </ul>
                  <dl>
            <dt> <a class="resume_icon_diy icon wbdfont" for-id="work" style="font-size:none"></a> <span>
              <div class="resume_lang_work">工作经历</div>
              <div class="Border resume_line" for-id="work" style="width:668px;border-top-style:solid;border-top-width:2px;"></div>
              </span> </dt>
            <dd class="resume_append_area">
                      <div class="baseContent baseDel resume_item_items resume_delete_area">
                <div class="delete resume_delete"></div>
                <div class="conTitle"> <span class="conTitle_time">
                  <div class="resume_time baseBorder" contenteditable="true">2014.6-至今</div>
                  </span> <span class="conTitle_company">
                  <div class="resume_unit baseBorder" contenteditable="true">阿里巴巴 搜索事业部</div>
                  </span> <span class="conTitle_post">
                  <div class="resume_job baseBorder" contenteditable="true">研发工程师</div>
                  </span> </div>
                <div class="baseDel_ resume_delete_area_">
                          <div class="delete_ resume_delete_"></div>
                          <div class="conDisc baseBorder resume_value" contenteditable="true" data-toggle="tooltip" data-placement="top" title="复制粘贴文字请右键-粘贴为纯文本">
                    <p>1、负责公司内部业务系统的设计及改进，参与公司网上商城系统产品功能设计及实施工作。</p>
                    <p>2、负责客户调研、客户需求分析、方案写作等工作， 参与公司多个大型电子商务项目的策划工作，担任大商集团网上商城一期建设项目经理。</p>
                  </div>
                        </div>
              </div>
                    </dd>
          </dl>
                </div>
        
        
        
        <div class="outexperDiv baseItem positonDiv resume_item resume_add_area resume_sort resume_notice" notice-key="project" id="resume_project" for-key="project">
                  <ul class="editBtn">
            <li class="btnMove" style="cursor:move;"data-placement="top" title="拖动调整上下位置"></li>
            <li class="btnPlus resume_add" for-key="resume_item" data-placement="bottom" title="添加一项"></li>
            <li class="btnDel resume_hidden" for-id="resume_project" data-placement="bottom" title="隐藏该模块"></li>
          </ul>
                  <dl>
            <dt> <a class="resume_icon_diy icon wbdfont" for-id="project" style="font-size:none"></a> <span>
              <div class="resume_lang_project">项目经验</div>
              <div class="Border resume_line" for-id="project" style="width:668px;border-top-style:solid;border-top-width:2px;"></div>
              </span> </dt>
            <dd class="resume_append_area">
                      <div class="baseContent baseDel resume_item_items resume_delete_area">
                <div class="delete resume_delete"></div>
                <div class="conTitle"> <span class="conTitle_time">
                  <div class="resume_time baseBorder" contenteditable="true">2013.6-2013.9</div>
                  </span> <span class="conTitle_company">
                  <div class="resume_unit baseBorder" contenteditable="true">wrapper开发</div>
                  </span> <span class="conTitle_post">
                  <div class="resume_job baseBorder" contenteditable="true"></div>
                  </span> </div>
                <div class="baseDel_ resume_delete_area_">
                          <div class="delete_ resume_delete_"></div>
                          <div class="conDisc baseBorder resume_value" contenteditable="true" data-toggle="tooltip" data-placement="top" title="复制粘贴文字请右键-粘贴为纯文本">
                    <p>负责机票事业部航班信息的抓取工作；主要参与开发抓取不同航空公司航班信息的wrapper，将抓回</p>
                    <p>的数据解析成约定的格式，供机票查询结果使用</p>
                  </div>
                        </div>
              </div>
                      <div class="baseContent baseDel resume_item_items resume_delete_area">
                <div class="delete resume_delete"></div>
                <div class="conTitle"> <span class="conTitle_time">
                  <div class="resume_time baseBorder" contenteditable="true">2014.6-至今</div>
                  </span> <span class="conTitle_company">
                  <div class="resume_unit baseBorder" contenteditable="true">反作弊</div>
                  </span> <span class="conTitle_post">
                  <div class="resume_job baseBorder" contenteditable="true"></div>
                  </span> </div>
                <div class="baseDel_ resume_delete_area_">
                          <div class="delete_ resume_delete_"></div>
                          <div class="conDisc baseBorder resume_value" contenteditable="true" data-toggle="tooltip" data-placement="top" title="复制粘贴文字请右键-粘贴为纯文本">
                    <p>角色：主要开发</p>
                    <p>系统介绍：魔戒是一个处罚卖家作弊的平台，举报供运营同学处理举报的工具，白名单提供存储和查</p>
                    <p>询商品、卖家、类目白名单的服务</p>
                    <p>主要工作：负责魔戒、举报和白名单的日常维护和开发</p>
                    <p>技术：php、mysql</p>
                  </div>
                        </div>
              </div>
                      <div class="baseContent baseDel resume_item_items resume_delete_area">
                <div class="delete resume_delete"></div>
                <div class="conTitle"> <span class="conTitle_time">
                  <div class="resume_time baseBorder" contenteditable="true">2015.1-2015.3</div>
                  </span> <span class="conTitle_company">
                  <div class="resume_unit baseBorder" contenteditable="true">淘宝来测吧</div>
                  </span> <span class="conTitle_post">
                  <div class="resume_job baseBorder" contenteditable="true">职位</div>
                  </span> </div>
                <div class="baseDel_ resume_delete_area_">
                          <div class="delete_ resume_delete_"></div>
                          <div class="conDisc baseBorder resume_value" contenteditable="true" data-toggle="tooltip" data-placement="top" title="复制粘贴文字请右键-粘贴为纯文本">
                    <p>角色：后端开发</p>
                    <p>系统介绍：淘宝来测吧是一个众测系统，面向云客服的一个付费系统，对用户权限校验，题目的数量</p>
                    <p>控制的准确性都要求比较高</p>
                    <p>工作：负责后端开发，包括发题、答题、回收题目和权限校验等</p>
                    <p>技术：yii框架、memcached缓存和mysql</p>
                  </div>
                        </div>
              </div>
                      <div class="baseContent baseDel resume_item_items resume_delete_area">
                <div class="delete resume_delete"></div>
                <div class="conTitle"> <span class="conTitle_time">
                  <div class="resume_time baseBorder" contenteditable="true">2015.4-至今</div>
                  </span> <span class="conTitle_company">
                  <div class="resume_unit baseBorder" contenteditable="true">淘宝主搜索</div>
                  </span> <span class="conTitle_post">
                  <div class="resume_job baseBorder" contenteditable="true"></div>
                  </span> </div>
                <div class="baseDel_ resume_delete_area_">
                          <div class="delete_ resume_delete_"></div>
                          <div class="conDisc baseBorder resume_value" contenteditable="true" data-toggle="tooltip" data-placement="top" title="复制粘贴文字请右键-粘贴为纯文本">
                    <p>角色：业务端开发</p>
                    <p>系统介绍：主搜索支撑阿里集团的搜索服务</p>
                    <p>工作：1、作为PM负责产品搜和主搜的java迁移；2、主搜日常需求的开发和维护</p>
                    <p>技术：java、spring、webx</p>
                  </div>
                        </div>
              </div>
                    </dd>
          </dl>
                </div>
        
        
        
        <div class="selfDiv baseItem positonDiv resume_item resume_sort resume_notice" notice-key="self" id="resume_self" for-key="self">
                  <ul class="editBtn">
            <li class="btnMove" style="cursor:move;"data-placement="top" title="拖动调整上下位置"></li>
            <li class="btnPlus" data-placement="bottom" title="添加一项" style="display:none;"></li>
            <li class="btnDel resume_hidden" for-id="resume_self" data-placement="bottom" title="隐藏该模块"></li>
          </ul>
                  <dl>
            <dt> <a class="resume_icon_diy icon wbdfont" for-id="self" style="font-size:none"></a> <span>
              <div class="resume_lang_self">自我评价</div>
              <div class="Border resume_line" for-id="self" style="width:668px;border-top-style:solid;border-top-width:2px;"></div>
              </span> </dt>
            <dd>
                      <div class="baseContent">
                <div class="conDisc baseBorder resume_lang_self_value resume_value" contenteditable="true" data-toggle="tooltip" data-placement="top" title="复制粘贴文字请右键-粘贴为纯文本">
                          <p>本人做事稳重，对待工作认真，责任心较强，待人真诚，善于沟通，时刻保持学习，积极拥抱变化。喜</p>
                          <p>欢java 开发，具备一定的软件分析、设计、开发和应用能力，拥有较强的学习能力与团队精神，能够</p>
                          <p>很快的适应工作环境。</p>
                        </div>
              </div>
                    </dd>
          </dl>
                </div>
      </div>
            </div>
  </div>
        </div>
</body>
</html>

🎁更多干货

1.如果我的博客对你有帮助、如果你喜欢我的博客内容，请 “👍点赞” “✍️评论” “💙收藏” 一键三连哦！

2.💗【👇🏻👇🏻👇🏻关注我| 获取更多源码 | 优质文章】 带您学习各种前端插件、3D炫酷效果、图片展示、文字效果、以及整站模板 、大学生毕业HTML模板 、期末大作业模板 、等! 「在这里有好多 前端 开发者，一起探讨 前端 Node 知识，互相学习」！

3.

以上内容技术相关问题💌欢迎一起交流学习👇🏻👇🏻👇🏻🔥

网站公告

今日签到

点亮在社区的每一天
去签到

热门文章

最新发布