- 博客(16)
- 收藏
- 关注
![](https://csdnimg.cn/release/blogv2/dist/pc/img/listFixedTop.png)
原创 flex布局-图片上下两端对齐文字
在写样式的时候我们会经常碰见这种样式,一般商品信息或者用户信息都会这样设计。有的时候会不知道怎么布局,今天我叫大家一个最简单的方法。 //1.我们先给父盒子属性,使其头像盒子和文字盒子在一行并且左右贴两边 .fatherBox { display: flex; align-items: center; justify-content: space-between; } //2.然后给头像盒子和文字盒子一样的高度。 .ImgBox { width:100px; .
2021-05-13 17:14:06
2582
2
![](https://csdnimg.cn/release/blogv2/dist/pc/img/listFixedTop.png)
原创 前端开发电脑配置
我们在刚入职的时候,公司会让我们自己来配置电脑。下面是一些实用性的软件。1.Visual Studio Code这是我们前端开发人员相对来说最多使用的代码编辑器了,可以下载各种插件来辅助我们编写代码。下载链接: https://code.visualstudio.com/.2.Chrome浏览器谷歌浏览器,是目前最全面的浏览器,对我们写的代码非常友好,包括也支持各种各样的插件。下载链接: https://www.google.cn/chrome/.注:我这个是安装了csdn出品的插件
2021-03-22 11:09:29
3569
2
![](https://csdnimg.cn/release/blogv2/dist/pc/img/listFixedTop.png)
原创 2021最新前端面试题
以下是2021年最新的公司面试题try catch 的实现原理。token怎么处理?刷新token的原理,为啥需要刷新token。组件通信方法有哪些?事件总线和vuex的区别。vue数据双向绑定原理,vue3又是怎么处理的,proxy的缺点。生命周期函数。路由导航钩子。vue的优缺点。对云开发和微前端有没有了解过?数组去重,怎么把set数据结构转成数组?axios请求怎么使用?axios与ajax区别。axios请求在vuex什么地方使用?路由跳转有哪几种方式?axios的二次
2021-03-18 13:04:38
991
1
原创 uniapp运行小程序提示当前系统代理不是安全代理,是否信任?
有的时候我们使用uniapp运行小程序的时候会出现如下的情况,很是头痛。我这边的处理方式是打开任务管理器
2021-05-08 16:41:59
589
1
原创 uniapp打开地图选择位置(查看位置)详解
开发小程序的时候,有时候要做打开地图选择位置和打开地图查看当前位置。我前段时间刚做的时候也是一脸懵逼(新手上路)。我是用的uniapp做的,配置方法和原生小程序的配置方法不太一样。下面就是我写的配置方法以及步骤,感兴趣的大家可以看看。第一步:uniapp需要先调取用户授权请求询问用户是否授权uni.authorize({ scope: 'scope.userLocation', success() { uni.getLocation() }})详.
2021-05-07 10:50:40
15320
2
原创 uniapp点击预览图片(包括多张左右滑动查看)
我们有时候需要做图片预览功能。但是对新手来说一脸懵逼,看文档又看不太明白,接下来小杰就把它简单化的实现起来。这是官方的说明,第一次尝试的时候都会没反应也没报错(话说这种情况是最难受的吧)。下面我直接把我写的实例放下面供大家参考(如果有不对的地方请大佬批评) // 预览图片 点击事件名称() { uni.previewImage({ urls: (这里放图片的数组,也就是放所有图片的集合), current:(这里官方说了可以放当前点击的图片路径也可以放当前.
2021-05-07 10:11:52
6496
2
原创 uniapp正则校验
我前段时间逛插件市场发现一个很好用的uniapp正则校验,让我这个小菜鸡不用再自己做输入框的校验。真是解放了自己的双手啊!现在我把它分享给大家。只需要将这些代码放到公共js文件然后在main.js页面全局注册就行了,真的是很耐斯的哈!(有些校验我也看不懂,但是不耽搁我们自己配置)const numberReg = /^-?[1-9][0-9]?.?[0-9]*$/const intReg = /^-?[1-9][0-9]*$/const phoneReg = /^1[0-9]{10,10}$/.
2021-04-28 15:29:18
6648
2
原创 微信小程序无法设置背景图片问题
大家在开发小程序的时候设计稿上会有一张图片在下,内容在图片上的样式。类似下面这张:然而小程序设置背景图有图片大小限制。有些人直接使用服务器上的图片,还有些人把图片转换成base64格式的图片。但是这都不是解决问题最好的方法;接下来小杰给大家带来一个简单方便的办法; 我们只需要在需要设置背景图的盒子里放上一张image标签。 <view class="myBox"> <image src="需要设置成背景图的图片路径" mode="aspectFill"></.
2021-04-22 15:30:10
1202
1
原创 正则校验提示框
我们在做输入框判断的时候还需要自己手写校验方法和提示框样式,这样很麻烦。以下就是一个封装好的校验方案!/**1、在要验证的input中写上form-verify="验证方法名|验证方法名" 可写多个但要用|分隔开 */var checkedInput = { //用户名 userNames: [ /^[a-zA-Z0-9_-]{2,20}$/, '由2-20位的字母或数字组成' ], userName: [ /^[a-zA-Z\u4e00-\u9fa5]{2,10}$/, '由2-
2021-03-18 10:09:28
455
原创 解决移动端一像素边框问题!
我们在做移动端的时候,有些地方需要添加边框线。但是我们自己加点1px线又很粗,达不到我们想要得效果,以下就是解决方案。/*1px解决方案*/.border-t { border-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAS0lEQVRIiWO8efPmf4YBAEwDYemAWsyCzFFTU2OkpWW3bt2CR+vIC+pRi0ctHrV41OJRi0ctHrV41OJ
2021-03-17 11:37:19
295
原创 淘宝rem适配方案flexible.js
每次做移动端的时候适配是最讨厌的问题,使用普通rem的时候会出现某些设备换算不清。导致页面结构出现偏差,所以我推荐使用淘宝的flexible解决方案。在做移动端的时候将以下代码保存到一个公共的js,每次使用的时候引入。然后换算的话我推荐使用vscode中的插件进行换算,在扩展设置里将数值调整一下即可使用!方便我们使用。然后这是flexible.js的内容:; (function (win, lib) { var doc = win.document; var docEl = doc.d
2021-03-17 10:49:33
1556
原创 解决微信放大字体影响页面结构问题
有些时候,微信字体放大的话会影响页面布局结构。让我们很头疼,今天教大家解决这个问题!ios使用以下方法:在公共css文件中给body加上 -webkit-text-size-adjust: 100% !important;Android使用以下方法:在公共js文件加上(function () { if (typeof WeixinJSBridge == "object" && typeof WeixinJSBridge.invoke == "function") {
2021-03-17 10:35:21
688
原创 HTML+CSS基本标签(属性)
前端小菜,多多谅解!HTML常用标签:<!DOCTYPE html>: 声明帮助浏览器正确地显示网页;<html></html> : 网页描述,定义整个HTML文档的;<body></body>: 页面可见内容,页面主题内容;<meta></meta>: 提供页面相关元素等等,描述文档信息;<title></title>: 头部标签,浏览器顶部标题;<style></s
2021-02-03 10:31:54
625
原创 jquery基本使用
jquery基本方法入口函数:$(function(){ });选择器:标签选择器(元素选择器) $(“html标签名”) 获得所有匹配标签名称的元素id选择器 $("#id的属性值") 获得与指定id属性值匹配的元素类选择器 $(".class的属性值") 获得与指定的class属性值匹配的元素并集选择器 $(".class的属性值") 获得与指定的class属性值匹配的元素层级选择器 $("A B ") 选择A元素内部的所有B元素子选择器 $(“A > B”)
2021-02-03 10:25:26
119
原创 Swiper 手指触摸或滑动时执行
Swiper 手指触摸或滑动时执行第一次写博客,请谅解!代码如下(示例):<script language="javascript"> var mySwiper = new Swiper('.swiper-container',{ on:{ touchMove: function(swiper,event){ //你的事件 }, },})</script>更多方法可以查看swiper官网: https://www.swiper.
2020-12-22 10:18:01
830
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人