- 博客(32)
- 收藏
- 关注
RSS订阅原创 css设置边框颜色渐变
本文介绍了如何使用CSS实现左侧渐变边框效果。通过border-image属性和linear-gradient线性渐变，可以创建从上到下的金色边框。关键点包括：1)使用180deg或to-bottom方向控制渐变流向；2)通过border-image-slice参数(如101100%)将渐变仅应用于左侧边框；3)调整border-left-width和border-image中的数值可改变边框粗细。这种方法利用CSS3特性实现了优雅的装饰性边框效果。
2025-07-16 15:18:46
373
原创 使用element的el-progress进度条实现进度条上加一个图片并根据进度前进
实现一个带进度条和自定义内容的可视化组件。主要包含一个进度条（使用el-progress）和浮动显示区（custom-content），其中显示百分比数值和图标。CSS样式设置了响应式布局，包括进度条容器定位、自定义内容悬浮效果（限制在10%-84%范围内移动以防溢出），以及底部目标区域的图文排版。组件采用flex布局，具有平滑过渡动画，百分比数值使用DINPro字体突出显示，整体配色以蓝色为主。底部显示已完成金额和目标金额的对比信息。
2025-07-14 14:58:48
221
原创 vue前端实现倒计时
开发了一个可复用的倒计时组件，支持显示天、时、分、秒的倒计时效果。组件采用Vue框架实现，包含模板、逻辑和样式三部分。倒计时逻辑通过计算目标日期（2025年12月31日）与当前时间的差值实现，并自动补零显示两位数。样式方面使用了自定义数字字体（需从WebFontFree.Com下载Digital-7字体），包含渐变背景和边框效果。组件采用响应式设计，可自适应不同屏幕尺寸，可以直接引入使用，其中的字体文件需要到。
2025-07-14 14:50:30
195
原创 Vue 项目集成 Code Inspector Plugin
Code Inspector 是一个强大的开发工具，可以帮助你在浏览器中直接定位到 Vue 组件在编辑器中的位置。下面我将展示如何在 Vue 2 项目中安装和配置这个插件。2、配置vue.config.js。
2025-06-12 16:27:37
239
原创 vue 使用 vue-pdf 实现PDF在线预览
上面简单使用PDf只有1一页，如果想要多页可以使用for循环实现。如果在复杂一点可以加上点击按钮实现切换分页，旋转等。
2024-11-22 15:24:12
927
1
原创 使用echarts实现3D堆叠楼栋
引入echarts，需查询当前使用的echarts是否支持3D。当然代码很简陋，样式需自己调，这只是一个简单的demo应用。想要楼栋样式，可以点击每一层查询每一层的数据。
2024-10-23 14:28:08
483
原创 vue3+element Plus使用走马灯实现鼠标滚动选择
但是会有一个新的问题，当我们点出这个页面，第二次回到页面时，走马灯还是当前页，不会恢复到默认状态，需要将索引与year全都恢复默认。最近几天碰到一个需求觉得下拉框选择样式太难看了，想要鼠标滚动选择，左思右想还是只有走马灯可以实现鼠标滚动选择，以下是实现方法。到现在这一步已经实现了切换下一页或上一页，但是获取不到走马灯选择页面的数据，就需要加一个走马灯的索引事件。以上就是使用走马灯实现滚动选择数据调用接口查询数据，最后想说句下拉框挺好的！走马灯鼠标滚动切换事件。
2024-10-23 14:13:48
569
原创 tortoisegit 分支合并
这时就会弹出摘取页面，选中需要摘取的那次commit，点击继续，就会把这次commit合并并且提交到到本地的test分支上了，如果有冲突就要解决冲突。2、查看提交日志，点击这里切换到我们要合并的testV1的那个分支的日志。4、现在代码已提交到test分支的本地，还需要同步到git。3、在这次commit上右键弹出菜单，选择摘取此提交。从testV1分支选取部分文件合并到test分支上。1、我们需要切换到想要合并的分支上去。
2024-09-04 09:51:40
1905
1
原创 vue2使用audio标签实现播放外部音频
preload：是否音频在页面加载时进行加载，并预备播放。如果使用 “autoplay”，则忽略该属性。wav：为微软公司开发的一种声音文件格式，声音文件质量和CD相差无几。HTML5 audio支持的音频格式有wav，mp3和ogg格式。ogg：一种新的音频压缩格式，是完全免费、开放和没有专利限制的。mp3：是一种音频压缩技术。controls：是否向用户显示控件，比如播放按钮。autoplay：是否音频在就绪后马上播放。loop：是否音频结束时重新开始播放。src：要播放的音频的 URL。
2024-06-20 16:28:03
2767
原创 vue数据深拷贝
Vue父子组件传递数据的时候，浅拷贝会出现修改数据相互影响的情况。比如修改失败，前端的页面表单的数据还是改变了，是因为增加和修改共用一个表单，所以每次打开表单时增加要给表单赋空值，使用深拷贝代替浅拷贝。
2024-06-06 10:02:22
225
原创 vue定时器setInterval、setTimeout
定时执行 setTimeout 是设置一个时间，等待时间到达的时候只执行一次，但是执行完以后定时器还在，只是不再运行；循环执行就是设置一个时间间隔，每过一段时间都会循环执行这个方法,直到这个定时器被销毁掉；1、循环执行setInterval。2、定时执行setTimeout。
2023-09-04 14:25:47
1084
1
原创 localStorage、sessionstorage的使用、存储、读取、删除
但有时value为一个对象Object,以上面的方式写入,会出现读取的返回值为{object Object}的情况,但这并不是我们想要的,此时我们需要使用新的方式传入Object，通过JSON.stringify(Object)方法将对象转化为一个json格式的字符串进行存储。相对的在读取json格式字符串只有我们也无法直接使用,需要将它转换为josn对象之后才是我们想要的结果,所以我们需要调用 JSON.parse()方法来进行转化。2、读取（读取对象同localStorage）
2023-09-04 14:10:07
450
1
原创 git使用命令拉取、推送代码
如果连接时出现上图情况，可以先删除git远程仓库，再执行连接远程仓库命令。通过这条指令检查文件有没有被添加。被添加的文件会呈现为绿色。
2023-09-01 13:50:10
1743
1
原创 关于vue的一些数据处理方式
splice( index, len, [item]) 用来删除/替换/添加数组内某一个或者几个值（该方法会改变原始数组）。4、unshift() 方法可向数组的开头添加一个或更多元素，并返回新的长度。1、.push()方法可向数组的末尾添加一个或多个元素，并返回新的长度。5、splice() 方法向数组中添加或删除项目，然后返回被删除的项目。10、.slice()方法从已有的数组中返回选定的元素。7、reverse() 方法用于颠倒数组中元素的顺序。2、.pop() 方法用于删除数组的最后一个元素。
2023-08-31 15:17:18
1446
原创 vue项目如何在main.js文件中使用vant组件的loading
【代码】vue项目如何在main.js文件中使用vant组件的loading。
2023-08-31 08:57:13
869
原创 前端vue安装环境
注意：node最好 默认它的安装路劲，这样会自动配置环境变量，更换了安装目录，环境变量可能需要自己手动去配置了。在此处将生成的公钥（在.ssh文件夹中的id_rsa.pub) 中的内容复制进来。2、查看Git的版本号：打开终端—输入命令git --version。1、查看本机是否安装了Git: 打开终端—输入命令git。3、配置公钥置Git处（此处以GitHub为例）查看cnpm是否安装成功：输入cnpm -v。一、node.js安装（必备）查看node.js是否安装成功。1、初始化自己的邮箱。
2023-07-06 21:34:20
131
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人