![](https://img-blog.csdnimg.cn/20201014180756757.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
工具
文章平均质量分 52
工具
喵喵酱仔__
这个作者很懒,什么都没留下…
展开
-
(响应式PC端媒体查询)电脑屏幕分辨率尺寸大全
用min-width时,小的放上面大的在下面,同理如果是用max-width那么就是大的在上面,小的在下面。1024*768 (比例4:3 | 10.4寸、12.1寸、14.1寸、15寸;1280*1024(比例:5:4 | 14.1寸、15.0寸)1440*1050(比例:5:4 | 14.1寸、15.0寸)1680*1050(16:10 | 15.4寸、20.0寸)1366*768 (比例:16:9 | 不常见)1280*800(16:10 |15.4寸)PC端响应式媒体断点。原创 2023-06-16 20:03:09 · 4274 阅读 · 0 评论 -
淘宝flexible.js+rem适配pc端
1、引入flexible.js文件:// 这里默认是10等份,手动改为24,此时1rem=1920/24px即80px。(设计稿是1920px的)2、cssrem的Root Font Size改为80,修改完重启vscode。原创 2023-06-15 23:21:04 · 717 阅读 · 0 评论 -
导入导出--前端做逻辑
二、导出表 ==> 使用插件 : npm install file-saver。插件网址:https://vue-xlsx.netlify.app/一、导入表 ==> 使用插件 : npm install xlsx。1. 导入表和导出表==>普通用法。4. 大量数据的导入导出的性能优化。3. 数据导出的组织架构。2. 分页数据的导出。原创 2023-06-02 18:51:04 · 324 阅读 · 1 评论 -
wow.js+animate.css+vue实现显示时执行动画
在需要动画的元素上面加上类名 wow 和 animation.css 动画的 class 即可,还可以加上 data-wow-duration(动画持续时间)、data-wow-delay(动画延迟时间)、data-wow-offset(元素的位置露出后距离底部多少像素执行)和 data-wow-iteration(动画执行次数)这四个属性可选可不选。npm 安装 wow.js,安装后 animate.css 会自动安装。wow.js+animate.css+vue实现显示时执行动画。原创 2023-05-05 22:32:45 · 346 阅读 · 0 评论 -
搜索框vue
4. 输入内容 又删除--输入的值为空 搜索列表隐藏 热门城市显示。6. 输入的值存在 聚焦 显示搜索列表。3. 输入内容 显示搜索列表 热门城市隐藏。5. 输入的值存在 失去焦点 隐藏搜索列表。2. 失去焦点热门城市隐藏。1. 聚焦显示热门城市。原创 2023-04-26 11:30:18 · 369 阅读 · 0 评论 -
如何在vue2项目中使用Swiper5组件
之前做的业务需要在vue2中插入一个Swiper组件,但是尝试了很多次都一直失败,官方文档和能搜索到的方法也对我不太有用,总是报错!后来在大佬的视频(https://www.bilibili.com/video/BV1TY4y1z7Z8/?spm_id_from=333.337.search-card.all.click&vd_source=d45e199a358edbf199494ee895775ab3)中才明白是vue版本和Swiper版本没有对应上的问题。原创 2023-04-26 10:59:20 · 511 阅读 · 0 评论 -
vue实现密码显示隐藏、很简单易懂
1 利用input的type属性,当type值是text的时候展示密码,当type值是password的时候隐藏密码;3 加入一个图片元素,点击图标元素切换这个布尔值,就可以达到切换显示隐藏,切换布尔值的同时也切换图标。2于是很容易想到用v-bind来绑定type,同时用一个布尔值来控制,写成三元表达式的形式;原创 2023-04-26 10:17:06 · 1077 阅读 · 0 评论 -
Vue PostCss插件——autoprefixer,自动补全css浏览器前缀
Autoprefixer是一款基于PostCSS插件,用于解析CSS并使用Can I Use中的值向CSS规则添加供应商前缀。它是 Google 推荐的,并在Twitter和阿里巴巴中使用。可以实现css3代码自动补全,也可以运用到sass、less中前端开发中,为兼容所有浏览器,部分CSS属性需要加上不同的浏览器前缀,这些属性多且难记。当然,我们可以手动添加,这样会使开发变得枯燥无味,且容易出错、遗漏,可能会增加不必要的调试。这样既浪费时间,又在无形中给自己添加了很多没必要的工作量。原创 2023-04-25 17:54:32 · 1690 阅读 · 0 评论 -
vue 选项卡
初学者来说,这样的页面也是练手的好题目。下面一组代码,就能够实现基础的选项卡功能。在一个页面中实现多内容的切换。在实际的应用中也是比较常见的。选项卡是前端常见的一种形式。原创 2023-04-25 17:43:49 · 537 阅读 · 0 评论 -
echarts折线图
通过areaStyle来控制,不添加任何内容,有自己默认的颜色,需要修改阴影面积颜色,通过color来修改。(二)y轴方面的:其实和x轴一样,区别在于需将配置写在yAxis里面,方可生效。前提说明:xAxis表示x轴,yAxis表示y轴,series表示数据区域。4、x轴轴刻度线:通过splitLine来控制。3、刻度颜色和形状:通过axisTick控制。1、轴刻度值:通过axisLabel来控制。2、x轴轴线:通过axisLine来控制。1、y轴自定义轴刻度段,需要做以下配置。原创 2023-04-25 13:20:33 · 1015 阅读 · 1 评论 -
echarts编写-惠民服务平台
1 安装 :cnpm install echarts --save。头部是文字,body 里边是ul>li。使用flex 布局,分成三部分。3 定一个盒子,盒子得有宽和高。局部引入 哪使用引用到那。原创 2023-04-25 11:58:27 · 180 阅读 · 1 评论 -
echarts 饼图 基本配置
1 修改颜色1.1 提示一个颜色echarts饼图自定义设置颜色的三种方式_echarts饼图颜色-CSDN博客 修改方法series-pie.center官方文档代码 2、图例设置 3、值域设置 4、提示框设置 图中设置原创 2023-04-25 11:40:38 · 6597 阅读 · 1 评论 -
前端大屏适配几种方案
记录一下前端大屏的几种适配方案。我们是1920*1080的设计稿。文章目录一、方案一:rem+font-size1.查看适配情况1.1 1920*1080情况下1.2 3840*2160(4k屏)情况下1.3 7680*2160 超宽屏下二、方案二:vw(单位)三、方案三:scale(缩放)强烈推荐1、根据宽度比率进行缩放2、动态计算2.1、超宽屏最终适配效果大屏是适配是前端开发必不可少的技能,适配各种大屏也是为了给用户更好的体验。原创 2023-04-24 16:29:39 · 12695 阅读 · 7 评论 -
Vue + Animate.css 实现过渡效果
enter-active-class 对应的是进入时 Animate.css 中的一种效果。leave-active-class 对应的是离开时 Animate.css 中的一种效果。我使用的是 Animate 4.x 版本,跟 3.x 语法有区别。原创 2023-04-24 16:11:36 · 387 阅读 · 0 评论 -
Vue 图片懒加载怎么做?
Vue 图片懒加载是指,当图片进入可视区域时,才加载图片,以节省带宽和提升网站性能的优化技术。Vue 中可以使用 vue-lazyload 这个插件实现图片懒加载。3.修改图片显示方式为懒加载(将 :src 属性直接改为v-lazy)原创 2023-04-24 14:56:38 · 650 阅读 · 0 评论 -
实现小米右侧浮动菜单 (回到顶部)
【代码】实现小米右侧浮动菜单 (回到顶部)原创 2023-04-24 14:36:56 · 334 阅读 · 0 评论 -
vue实现浮动广告(浏览器范围内匀速移动)
【代码】vue实现浮动广告(浏览器范围内匀速移动)原创 2023-04-24 14:11:25 · 573 阅读 · 0 评论 -
vue小练习
Demo 在线地址:文件格式:.vue。原创 2023-04-24 12:36:40 · 64 阅读 · 0 评论 -
Vue封装常用的插件例如:“返回顶部、弹出层、吸顶效果”
【代码】Vue封装常用的插件例如:“返回顶部、弹出层、吸顶效果”原创 2023-04-24 10:59:48 · 178 阅读 · 0 评论 -
vue项目实现回到顶部的两种超简单方法
通过点击事件将scrollTop重置为0,从而达到。原创 2023-04-24 09:11:52 · 4119 阅读 · 0 评论 -
导出 导入
vue原创 2023-03-21 13:14:29 · 34 阅读 · 0 评论 -
图片上传vue --file
vue原创 2023-03-21 00:14:47 · 1178 阅读 · 0 评论 -
Vue利用canvas绘制验证码并添加校验
vue原创 2023-03-20 21:56:24 · 388 阅读 · 0 评论