html页面简历

最新推荐文章于 2023-03-29 15:11:45 发布
最新推荐文章于 2023-03-29 15:11:45 发布
阅读量1.4k 收藏 4
点赞数
文章标签： HTMl简历

<!doctype html>

<html lang="zh">

<head>

  <meta charset="UTF-8">

  <title>zsy的响应式个人简历 - GBtags.com</title>

  <link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet">

  <link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css" rel="stylesheet">

  <style>

/* 定义辅助CSS来美化简历头部 */

body{

  font-family: 'microsoft yahei',Arial,sans-serif;

}

.cvheader{

  border-bottom: 1px solid #DFDFDF;

  padding-top:30px;

  padding-bottom:20px;

}

.cvheader h1{

  margin:0;

}

.address{

  background: #efb73e;

  color: #fff;

  padding: 10px 0;

}

/* 定义辅助CSS来美化简历主体 */

.cvbody{

  padding-top: 50px; 

}

.cbox{

  margin-bottom: 30px;

  color: #FFF;

  padding: 45px;

}

/* 定义cbox颜色 */

.green{

  background: #2ecc71;

}

.orange{

  background: orange;

}

.red{

  background: #dd4814;

}

.bbox{

  border: 1px solid #DFDFDF;

  border-radius: 5px;

  margin-bottom:30px;

  padding: 38px;

}

.footer{

  margin: 30px 0 30px;

  padding: 50px;

  background: #CCC;

  color: #FFF;

}

</style>

</head>

<body>

  <!-- 定义简历的头部 //-->

<div class="container">

  <div class="row cvheader">

    <div class="col-lg-7 col-md-7 col-xs-12">

      <!--  添加颜色//-->

      <h1 class="text-primary">邹双玉</h1>

      <!--  添加图标 //-->

      <p><span class="glyphicon glyphicon-paperclip"></span> 前端工程师 && UI设计师</p>

    </div>

    <div class="col-lg-3 col-md-3 col-xs-12">

      <div class="row">

        <div class="col-lg-4 col-md-4 col-xs-4">

          <p id="contact" class="address text-center">联系</p>

        </div>

        <div class="col-lg-8 col-md-8 col-xs-8">

          <p><span class="glyphicon glyphicon-envelope"></span> 1017165370@qq.com</p>

          <p><span class="glyphicon glyphicon-earphone"></span> 15980932621</p>

          <p><span class="glyphicon glyphicon-road"></span>厦门市何厝下何333</p>

        </div>

      </div>

    </div>

    <div class="col-lg-2 col-md-2 col-xs-12">

      <p>

        <!-- 这里定义图片为响应式，并且添加圆角效果，以便保证图片在不同设备上都可以完美显示 //-->

        <img data-toggle="tooltip" data-placement="left" id="avatar" title="我是邹双玉" class="img-responsive img-rounded" src="http://www.gbtags.com/gb/networks/avatars/13d6393f-a44c-4180-8cb6-7bf0e4776283.png" alt="">

       </p>

    </div>

  </div>

</div>

<!-- 定义简历的主体部分 //-->

<div class="container">

  <div class="row cvbody">

    <!-- 这里定义两个区域，布局定义如下：//-->

    <div class="col-lg-6 col-md-6 col-xs-12">

      <div class="row">

        <div class="cbox green">

          <h4>个人介绍</h4>

          <p>

            在校期间，担任过多个职位，参加过多个项目开发；<br/>在易联众任职期间，能够积极配合项目组其他成员，认真完成领导分配的任务；<br/>课余时间，能够及时总结工作中遇到的问题。

          </p>

        </div>

        <div class="cbox red">

          <h4>个人技能</h4>

          <p>

            <!-- 这里使用Bootstrap3的组件添加技能 //-->

            HTML/CSS/Javascript

            <div class="progress">

              <div class="progress-bar progress-bar-success" style="width:80%"></div>

            </div>

            Java/J2EE

            <div class="progress">

              <div class="progress-bar progress-bar-primary" style="width:90%"></div>

            </div>

            数据库

            <div class="progress">

              <div class="progress-bar progress-bar-info" style="width:80%"></div>

            </div>

            Photoshop/UI

            <div class="progress">

              <div class="progress-bar progress-bar-warning" style="width:50%"></div>

            </div>

          </p>

        </div>

        <div class="cbox orange">

          <h4>语言水平</h4>

          <p>

<canvas id="en" width="150" height="150" class="pull-left"></canvas>

<canvas id="zh" width="150" height="150" class="pull-right"></canvas>

<p class="clearfix"></p>

          </p>

        </div>

      </div>

    </div>

    <!-- 为了清楚的分割两个区域，这里我们添加了一个空白区域，或者也可以在CSS中定义Margin实现//-->

    <div class="col-lg-1 col-md-1 col-xs-12"></div>

    <div class="col-lg-5 col-md-5 col-xs-12">

      <div class="row">

        <div class="bbox">

          <h4>教育背景</h4>

          <p>2010/09-2014/7:福建师范大学 | 计算机科学与技术 | 本科<br/>2007/09-2010/7:福建省将乐一中| 高中</p>

        </div>

        <div class="bbox">

          <h4>工作经验</h4>

          <p>2014/03-2018/03:易联众信息技术股份有限公司 | 前端开发工程师</p>

        </div>

        <div class="bbox">

          <h4>个人爱好</h4>

          <p>

            <span class="glyphicon glyphicon-tree-deciduous"></span> 骑马

            <span class="glyphicon glyphicon-plane"></span> 旅游

            <p><span class="glyphicon glyphicon-cutlery"></span> 美食</p>

            <p><span class="glyphicon glyphicon-music"></span> 音乐</p>

          </p>

        </div>

      </div>

    </div>

  </div>

</div>

<!-- 定义简历页底 //-->

<div class="container">

  <div class="row"><div class="footer text-center">如果您需要更多了解我，请您关注我的微博</div></div>

</div>

<!-- 引入jQuery类库和Bootstrap3的Javascript类库 //-->

<script type='text/javascript' src="http://libs.baidu.com/jquery/1.11.1/jquery.js"></script>

<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>

<script>

/*Javascript源代码*/

$(function(){

  $('#contact').popover({

    placement:'bottom', 

    container: 'body', 

    html:true, 

    content:'<p>QQ: 1017165370</p><p>微博：weibo.com/gbtags</p><p>微信：15980932621</p>'

  });

  $('#avatar').tooltip({

    'placement':'bottom'

  });

$.getScript('http://www.chartjs.org/assets/Chart.js',function(){

  var zhdata = [{

label: '中文水平',

value: 90,

highlight: "#FFC870",

color: "#F7464A"

}, {

value: 10,

color: "#EEEEEE"

}

]

var zhoptions = {

animation: true,

segmentShowStroke : false

};

var c = $('#zh');

var ct = c.get(0).getContext('2d');

var zhChart = new Chart(ct).Doughnut(zhdata, zhoptions);

  var endata = [{

label: '英文水平',

value: 80,

highlight: "#5AD3D1",

color: "#4D5360"

}, {

        value: 20,

        color: "#EEEEEE"

}

]

var enoptions = {

animation: true,

segmentShowStroke : false

};

var c = $('#en');

var ct = c.get(0).getContext('2d');

var enchart = new Chart(ct).Doughnut(endata, enoptions);

});

});

</script>

</body>

</html>


qq_15704535
关注
  • 0
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
35个静态HTML个人简历模板
06-24
静态HTML个人简历模板，简单易上手，如果有个人服务器的话挂到个人服务器上也非常nice
python 写入csv时添加表头，这个是亲测，最详细最傻瓜教程
weixin_bangzhu168的博客
11-11 1万+
遇到过这个问题，但是对于很多小白来讲，一直都看的模棱两可，现在我们以在采集好数据后写入csv举例说明：重要知识点：表头先进去。放在采集的循环体外，没事不懂的小白，一会我贴全部代码。
【Bootstrap】学习笔记（二）——CSS布局
ZhShy
01-18 685
排版 标题： h1~h6标签 样式类：h1~h6 小标题：标题内嵌.small；字号更小，颜色更小 段落： p标签：字体14px 行高1.428 1/2行高的底部外边距（10px） 中心内容：.lead样式类；更大更粗行高更高的段落文本 mark标签 用于突出高亮文本 文本 小号文本 small标签可以设置文本为父元素字体大小的85% 段落文本小号文本 del和s标签 删除线 del：删...
cvCreateImage与cvCreateImageHeader区别和使用
hanshanbuleng的博客
07-22 3478
1. cvCreateImage使用方法 1.1功能：创建图像首地址，并分配存储空间。 IplImage* cvCreateImage(CvSize cvSize(int width, int height), int depth, int channels); 参数说明： 1.CvSize cvSize(int width, int height)：图像的宽度和高度 2.int d...
opencv 图像row、col坐标对应关系
lebeau的博客
08-30 3万+
声明：本内容转载自https://blog.csdn.net/u010189457/article/details/71553436?utm_source=itdadao&amp;utm_medium=referral，只为阅读方便。 行列与坐标系对应关系  行rows：Y (height) 列cols：X (width) 注意！注意！注意！  在Mat类型变量访问时下标是反着写的，即：按照...
非常好看的html网页个人简历
weixin_44678052的博客
02-25 1万+
文末获取gitee链接在前几天逛b站的时候，发现了个比较实用的东西-----个人简介网页版，相当于网页版的个人简历，相较于PDF形式的，网页版所能呈现内容更加丰富，而且更加美观，在BOOS上被HR小姐姐要简历的时候，给她一个网址，岂不是美哉(##)。界面美观，动画给力。代码简单，只包括一个HTML和一个CSS,便于在它上面进行修改，我这个零基础的小白，经过一番琢磨后，也能让它为我所用，甚至更上一层楼，有些夸张了哈(⊙o⊙)…适配了手机端，即使HR小姐姐是用手机在和你聊天，也能完美地展现自己。
html网页 个人工作简历
最新发布
01-01
简历包括工作职业，工作时间，个人身份等。可以添加头像图片。
网页版程序员简历HTML语言编写
06-01
简历模板是一个基本的程序员简历示例，使用HTML语言编写。以下是对该简历的介绍： 外观：简历使用了清晰的字体（Arial）和颜色搭配，以确保内容易读。背景颜色为浅灰色（#f0f0f0），文字颜色为深灰色（#333）。标题...
个人主页简历HTML模板
01-21
非常实用的个人主页简历HTML模板，非常实用的个人主页简历HTML模板非常实用的个人主页简历HTML模板非常实用的个人主页简历HTML模板非常实用的个人主页简历HTML模板
个人简历HTML页面
10-13
一个简单的HTML个人简介网页，在第十七行可以修改背景图片的路径，请按自己的实际情况修改即可，否则将无背景图案。不懂代码请不要随便修改，只需要修改其中的文字即可。会的勿喷。谢谢
学生个人简介html网页
11-17
简单学生个人简介网页，适合新手学习，交作业参考。采用div+css布局。
静态网页作品-精美个人主页源代码
11-08
针对很多人为了交作业在网上找静态网页作业，帮一个学生做的个人网页，经过美化修改，第一次发出来供初学者学习参考。 包含6个独立页面，分别为首页index.html、about.html、flash.html、message.html、photo.html、riji.html 关于本设计、flash欣赏、留言板、照片、日记 包含css样式表文件，背景音乐…… 希望大家喜欢！
32个html个人简历
12-06
html个人简历_供学习参考使用 32个..
html代码做的个人简历
09-12
HTML做的个人简历，非常好看，很适合个人主页 ，初学前端做的
个人简历html+css网页
11-06
主要是个人简历的网站网页前端，自己亲手写的，页面炫酷
html制作好看的个人简历(附源码)
xcLeigh
03-29 2万+
html制作好看的个人简历(附源码)，代码简单，通俗易懂，html实现好看的个人简历，界面酷炫，简洁明了，附件源码，下载后直接使用，可以用文本、工具（vscode，Hbuilder，dw）打开编辑自己的相关信息，也可在此框架下，扩展更多其他效果。
【博主推荐】html好看的个人简历网页版(附源码)
xcLeigh
06-18 3万+
html好看的个人简历网页版，好看的个人简历，个人简历，html个人简历，带源码的个人简历，带源码的html个人简历。
使用html和css制作静态网页版的个人简历
wwwwwwwangdanni的博客
09-23 1万+
使用html和css制作静态网页版的个人简历以上就是我写的简单的网页个人简历内容。
html简洁漂亮的个人简历,个人主页，个人简介网页版(源码)
热门推荐
xcLeigh
12-16 8万+
html简洁漂亮的个人简历,个人主页，个人简介网页版(源码)。一款非常简洁，亮丽的个人简介模板，适用于个人主页，个人简历等相关主题，界面分为个人信息，基本资料，专业技能，教育经历，工作经验等五个版块，支持扩张，具体效果见下面的原文链接，里面有视频和代码讲解。代码容易上手，下载后直接运行。
个人简历html+css网页代码
03-03
这是一个简单的个人简历网页，使用HTML和CSS进行设计和布局。在HTML中，我们使用标记语言来定义页面的结构和内容，包括标题、段落、列表等。在CSS中，我们使用样式来定义页面的外观和布局，包括颜色、字体、间距等。...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值