微信小程序终于可以支持npm导入第三方库了(https://developers.weixin.qq....),但是这种导入模式和使用模式有别于我们使用的npm调用。今天我按照有赞新出的vant小程序ui库来讲解如何导入npm资源。 第一步: 在小程序工程的根目录下执行: 1npm i vant-weapp -S --production 第二步: 保证当前你的微信开发者工具是最新版本,然后点击执行“构建npm“ 构建成功后会提示: 同时项目根目录中会多出一个目录“miniprogram_npm”,这个就是小程序可以识别的npm第三方库。 第三步: 这时候当我们需要在一个页面中调用vant组件,那么就要在对应的页面json中添加类似如下配置: 123456{"usingComponents":{ "van-button":"/miniprogram_npm/vant-weapp/button/index" }} 接着你就可以在wxml中直接调用这个ui组件了。 ...
1、本地安装git环境下载安装包安装即可 2、初始化git项目,生成 .git 配置目录进入项目根目录,右键 git bash here打开控制台 ,输入git init即可完成 3、将项目加入本地git仓库  git add . (此处add后面有空格 和点号)   git status   touch README.md (可不要)   git add README.md (可不要)   git commit -m “first commit” 4、在git、码云建好云端项目,生成git url (建好项目,在项目的克隆下载处复制url即可) 5、连接云端仓库,将本地仓库代码提交到云端仓库连接云端仓库 ==>git remote add origin https://gitee.com/xxx/xxx.git 为解决本地与云端版本冲突,加上-f参数,push文件 git push –set-upstream origin master -f 之后会提示输入云端仓库的用户名,密码,验证成功开始上传并完成,实测码云可通过 不加f会提示错误: ! [rejected] mas ...
因为设置了display: flex; 导致block布局变成了flex布局, 所以在子元素宽度没有被撑破的情况下,子元素宽度是有效的,但是当子元素内容过多,此时宽度会比实际宽度小,所以如果想要在已经设置了flex布局的基础上,再进行子元素宽度的设置,可以应用下面的样式: (在该子元素上设置) 12width: 120px;flex-shrink: 0; // 子元素不进行收缩 转载:https://blog.csdn.net/qq_28073073/article/details/90479025
利用display:-webkit-box来实现移动端横向滑动列表一、第一种方法123456789101112131415161718192021222324252627282930<!DOCTYPE html><html><head> <title>横向滑动</title> <style type="text/css"> .slide-box{ margin-top: 200px; height:35px; //--------------------------------------------------------------- display: -webkit-box; overflow-x: scroll; -webkit-overflow-scrolling:touch; //--- ...
一、导航下拉菜单被遮住,那是因为层叠关系错误我们必须理解层叠关系满足的2个条件: 1、必须是同级; 2、二者分别设定了position:relative 或 absolute 或 fixed; 这时候通过设置z-index才有效 看看我们比较常见的网页布局: html: 12345678910111213141516<!-- 头部 --><div class="header"> <div class="nav"> <ul class="mNav"> 这是下拉菜单 ......... </ul> </div> </div> <!-- banner --><div class="banner"> <div class="slider">这是焦点图....</div> ...
第一种方法:123456<div class="title"> <div class="flag"></div> <div class="content"> <img src="img_p1_title.png"> </div> </div> 12345678910111213141516171819.title { width: 100%; font-size: 0; height: 10%;}.title .content img { width: 35%;}/*--主要的--*/.content{ display: inline-block; vertical-align: middle; }.flag{ displ ...
1234567#triangle-up {    width: 0;    height: 0;    border-left: 50px solid transparent;    border-right: 50px solid transparent;    border-bottom: 100px solid red;} 123456789#triangle-down {    width: 0;    height: 0;    border-left: 50px solid transparent;    border-right: 50px solid transparent;    border-top: 100px solid red;} 123456789#triangle-left {    width: 0;    height: 0;    border-top: 50px solid transparent;    border-right: 100px solid red;    bor ...
CSS 中无法直接给背景图片加 opacity 属性,可以使用下面的方法绕过这个限制: 123456789101112131415161718div { width: 200px; height: 200px; display: block; position: relative;}div::after { content: ""; background: url(image.jpg); opacity: 0.5; top: 0; left: 0; bottom: 0; right: 0; position: absolute; z-index: -1; }
一、单行文本的居中1.文字水平居中1<div class='box' style="text-align: center;">hello world</div> 2.文本垂直水平居中1<div class="box2" style="width:150px;height:100px;line-height: 100px;">文本垂直水平居中</div> 二、多行文本的垂直居中通过verticle-align:middle实现CSS垂直居中。通过vertical-align:middle实现CSS垂直居中是最常使用的方法,但是有一点需要格外注意,vertical生效的前提是元素的display:table-cell。 2、通过display:flex实现CSS垂直居中。随着越来越多浏览器兼容CSS中的flexbox特性,所以现在通过“display:flex”实现CSS水平居中的方案也越来越受青睐。 通过display:flex实现CSS垂直 ...
安卓手机Android加速辅助可以打开使用访问浏览观看常用的设计网ins,instagram,twitch,Twitter,line,youtube,google,Messenger,推特,谷歌搜索浏览器访问google应用商店,Tumblr,facebook,脸书 谷歌地球软件下载注册登陆等等的加速辅助代理教程! 方法一单击下载软件outLine。 点击下载 安卓手机密钥,复制下面的密钥 黏贴到,刚才下载安装的软件,点击 add server ,再点击中间的绿色圆盘就好了 身为白嫖怪怎么可能没有免费的秘钥!!!😄😄😄 免费的秘钥:ss://YWVzLTI1Ni1nY206QW50MzZwaDRBWDhmSHg1OWZVVEx4TXFxQDg0LjE3LjU4LjE1MjozNDAwNw#@OutlineVpnOfficial-Italy 百度一下网上很多,总有一个可以让你上网的 测试是否成功: 浏览器地址输入网址 www.google.com 是否访问成功! 免费密钥不能用的话,可能需要付费买密钥,如果付费就不是很推荐了,身为白嫖党的我怎么可能付 ...
公告
博客微信小程序版已上线,同步更新,请扫码浏览。🎉