使用VUE做的个人简历

这是一个使用Vue.js编写的个人简历单页应用,包含了教育背景、工作经历、项目经验、技能展示等内容。简历样式基于Bootstrap,适用于前端开发者展示自身能力。
摘要由CSDN通过智能技术生成

简单使用vue实现的单页面demo,希望对大家有帮助!

连接查看地址:https://eight1302.github.io/my_resume/my_resume/view/resume.html

html部分

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <link rel="stylesheet" type="text/css" href="../css/resume.css">
        <link rel="stylesheet" type="text/css" href="../css/bootstrap.min.css">
        <link rel="stylesheet" type="text/css" href="../css/font-awesome.min.css">
        <link rel="shortcut icon" href="free.ico">
        <title>FREE履历</title>
    </head>
      <body>
        <div id="resume" class="col-md-12" style="height: 100%;overflow-y: auto;">
            <div class="col-md-12 resume" style="padding: 0;height: auto;width: 50%;max-width: 937px;margin-bottom: 40px;">
                <section class="col-md-10" style="padding: 0px;padding-bottom: 20px;">
                    <div class="col-md-2 img" style="padding: 0;">
                        <img v-bind:src="img" class="one">
                    </div>
                    <div class="col-md-10" style="padding: 0;">
                        <div class="col-md-12 name" style="padding: 0;">
                            <span style="font-weight: bold;">{ {name}}</span>
                        </div>
                         <div class="col-md-12 position" style="padding: 0;">
                           <span class="job">{ {job}}</span>
                        </div>
                        <div class="col-md-12 " style="padding: 0;">
                            <ul style="text-align: left;list-style: none;">
                                <li style="float: left;">
                                    <i class="fa fa-envelope" aria-hidden="true"></i>{ {email}} 
                                </li>
                                <li style="float: left;">
                                    <i class="fa fa-phone" aria-hidden="true"></i> { {phone}}
                                </li>
                                <li style="float: left;">
                                    <i class="fa fa-github" aria-hidden="true"></i> <a v-bind:href="github">{ {github_name}}</a>
                                </li>
                            </ul>
                        </div>
                        <div class="col-md-12" style="padding: 0;">
                            
                        </div>
                    </div>
                </section>
                <section class="col-md-12" style="padding: 0;height: auto;">
                    <div class="education">
                        <span class="education_ba">
                            <i class="fa fa-address-card-o fa-1" style="margin-right: 10px;"></i>{ {education_ba}}
                        </span>
                        <hr / style="border-top: 1px solid #161515;">
                    </div><

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值