小程序 - 个人简历

news/2025/2/19 3:35:10/

为了让招聘人员快速地认识自己,可以做一个“个人简历”微信小程序

展示自己的个人信息。

下面将对“个人简历”微信小程序进行详细讲解。

目录

个人简历

创建图片目录

页面开发

index.wxml

index.wxss

功能实现截图

总结


个人简历

创建图片目录

把图片文件放入小程序图片目录中

自动刷新加载

页面开发

index.wxml

简历的首页在index.wxml中编写。

代码如下:

<!--index.wxml-->
<view class="container"><!-- 头像区域 --><view class="top"><view class="user-img"><image src="/images/2631374422.jpg" /></view></view><!-- 详细信息区域 --><view class="menu"><view class="title">个人信息</view><view class="item">姓名:于工</view><view class="item">性别:男</view><view class="item">工作经验:8年</view><view class="item">职位:PHP开发工程师</view></view><!-- IT技能区域 --><view class="content"><view class="title">IT技能</view><view class="item">精通 PHP 语言,熟练使用 Laravel、ThinkPHP,了解Yii、CI</view><view class="item">熟悉LAMP、LNMP环境使用、搭建、调试、排错及优化</view><view class="item">熟练MySQL数据库表设计、索引优化、主从、常用的引擎、事务及优化</view><view class="item">熟练掌握Redis、MongoDB等Nosql数据库及项目应用</view><view class="item">熟练使用SVN、Git进行团队开发和线上部署</view><view class="item">熟练掌握Ajax,JS,Jquery,熟练应用Bootstrap、LayUi对后台布局开发</view><view class="item">熟悉Laravel 队列原理及在项目中实现功能</view><view class="item">熟悉Python爬虫,熟练使用Django框架</view></view>
</view>

index.wxss

样式设置在index.wxss文件中。

代码如下:

.top {background: #3A4861;width: 100%;padding: 20rpx 0;
}
.top .user-img {width: 252rpx;margin: 0 auto;
}.top image {width: 252rpx;height: 252rpx;border-radius: 50%;border: 6rpx solid #777F92;
}.menu {width: 100%;padding: 20rpx 0 20rpx 10rpx;
}.menu .title {height: 50rpx;line-height: 50rpx;font-size:36rpx;font-weight: bold;
}.menu .item {height: 50rpx;line-height: 50rpx;border-bottom: 2rpx solid #ccc;font-size: 34rpx;
}
.content {width:100%;padding:20rpx 0;padding-left: 10rpx;
}.content .title{height: 50rpx;line-height: 50rpx;font-size:36rpx;font-weight: bold;
}.content .item {flex-wrap: wrap;
}

功能实现截图

总结

使用原生的方式简单的实现了一个个人简历小程序的页面开发。


http://www.ppmy.cn/news/1551314.html

相关文章

如何使用 Codegen 加速 React Native 开发?

写在前面 在 React Native 开发中&#xff0c;经常需要编写大量的样板代码&#xff0c;例如组件、屏幕、API 等。这些重复性的工作不仅浪费时间&#xff0c;还容易出错。为了解决这个问题&#xff0c;Facebook 推出了一个名为 Codegen 的工具&#xff0c;它可以根据模板和配置…

上海迪士尼奇幻冬日巡游:IP营销如何出圈?

迪士尼&#xff0c;作为全球娱乐产业的巨头&#xff0c;一直以其卓越的IP营销能力闻名于世。而其推出的“迪士尼奇幻冬日巡游”&#xff0c;无疑再次展示了其深厚的营销功底和独特的IP魅力。上海迪士尼在品牌营销上如何出圈&#xff0c;吸引忠实消费者&#xff0c;成为了一个值…

【一文读懂】大语言模型

学习参考 项目教程&#xff1a;中文教程 代码仓库&#xff1a;代码地址 仓库代码目录说明&#xff1a; requirements.txt&#xff1a;官方环境下的安装依赖 notebook&#xff1a;Notebook 源代码文件 docs&#xff1a;Markdown 文档文件 figures&#xff1a;图片 data_base&…

Flink细粒度的资源管理

Apache Flink致力于为所有应用程序自动导出合理的默认资源需求。对于希望根据其特定场景微调其资源消耗的用户,Flink提供了细粒度的资源管理。这里我们就来看下细粒度的资源管理如何使用。(注意该功能目前仅对DataStream API有用) 1. 适用场景 使用细粒度的资源管理的可能…

javapackager 制作安装包失败

原文链接 mvn 包错误 问题 #129 fvarrui/JavaPackager Setup 生成取决于 Inno Setup&#xff0c;而 MSI 和 MSM 生成取决于 WiX Toolset。 您可以在 PowerShell 中以管理员身份轻松安装这两个工具&#xff0c;运行以下命令&#xff1a; 安装适用于 Windows 的 Chocolatey 包管…

自我的救赎!!!

机缘 暑假参加了一个线上比赛正式接触CTF&#xff0c;之前的我只会挖点简单的漏洞。 做到一个关于thinkphp的框架漏洞&#xff0c;我感觉之前学的知识还是不够&#xff0c;然后就开始学习一些top10以外的漏洞 收获 提示&#xff1a;在创作的过程中都有哪些收获 例如&#xf…

计算机基础(下)

内存管理 内存管理主要做了什么&#xff1f; 操作系统的内存管理非常重要&#xff0c;主要负责下面这些事情&#xff1a; 内存的分配与回收&#xff1a;对进程所需的内存进行分配和释放&#xff0c;malloc 函数&#xff1a;申请内存&#xff0c;free 函数&#xff1a;释放内存…

分布式储能监控系统为储能电站高效运维与精细化管理赋能

1、引言 随着全球对可持续发展和环境保护意识的增强&#xff0c;能源结构正在经历深刻的转型。传统化石能源因其不可再生性和环境污染问题而逐渐受到限制&#xff0c;而可再生能源如太阳能、风能等因其清洁、可持续的特性而受到广泛关注和推广。这一转型推动了储能技术的快速发…