<style lang="less">
@import "../style/weui.wxss"; // WXSS · 小程序 https://developers.weixin.qq.com/miniprogram/dev/framework/view/wxss.html
@wx-width: 750rpx;
@wx-width_px: 750;
@wx-width-one_unit: @wx-width/750;
@color-main_red: #F00;
@color-main_blue: #2CABE2; // TODO 全局统一;2018年10月2日 16:29:42
@page-padding-horizontal: @wx-width-one_unit*12;
 
.pay-type {
// 布局图片前通过margin负值去除padding
margin: 0 -@page-padding-horizontal;
display: inline-flex;
}
.pay-type_icon {
// image-height("file.png")
@this-img_orign-width_px: 98; // 原图 宽度 高度 98 40 像素 96*96 dpi
@w: @wx-width/2;
@h: @w*40/98;
width: @w;
height: @h;
}
 
 
 
 
 
 
 

通过less 计算 得出图片均分布局的更多相关文章

  1. CSS百分比padding实现比例固定图片自适应布局

    一.CSS百分比padding都是相对宽度计算的 在默认的水平文档流方向下,CSS margin和padding属性的垂直方向的百分比值都是相对于宽度计算的,这个和top, bottom等属性的百分比 ...

  2. UIButton的文本与图片的布局

    UIButton内部文本和图片的布局是我们日常代码中,不可缺少的部分,按钮默认左边图片右边文本,那要实现左边文本,右边图片,我们该怎么解决呢,上面图片,下面文本又该怎么办呢 其实很简单,今天总结下,目 ...

  3. 5分钟 搞定UIButton的文本与图片的布局

    UIButton内部文本和图片的布局是我们日常代码中,不可缺少的部分,按钮默认左边图片右边文本,那要实现左边文本,右边图片,我们该怎么解决呢,上面图片,下面文本又该怎么办呢 其实很简单,今天总结下,目 ...

  4. CSS3实现图片木桶布局

    CSS3实现图片木桶布局 效果图: 代码如下,复制即可使用: <!DOCTYPE html> <script> window.navigator.appVersion.inde ...

  5. IOS-UIButton的文本与图片的布局

    UIButton内部文本和图片的布局是我们日常代码中,不可缺少的部分,按钮默认左边图片右边文本,那要实现左边文本,右边图片,我们该怎么解决呢,上面图片,下面文本又该怎么办呢 其实很简单,今天总结下,目 ...

  6. 对宽度的控制原则 git commit -a -m "M 1、完成less计算得出图片的均分布局;";git push origin master:master

    <script> import wepy from 'wepy' import api from '../api/api' export default class recharge ex ...

  7. 向Docx4j生成的word文档添加图片和布局--第一部分

    原文标题:Adding images and layout to your Docx4j-generated word documents, part 1 原文链接:http://blog.iprof ...

  8. css实现九宫格图片自适应布局

    我之前写九宫格自适应布局的时候,每个格子是使用媒体查询器(@media)或者js动态设置css,根据不同的手机屏幕宽度,适配不同手机,但是这样有个很大的缺点,那就是移动端的屏幕尺寸太多了,就得写很多代 ...

  9. 使用ul和li进行图片的布局

    使用ul和li进行浮动布局(自适应) 1 图片上下两排: 首先盒子的宽度要给100% ul包裹一个div,首先量好盒子的宽和高,并进行设置, margin 0 auto 盒子居中显示 每个li向左浮动 ...

随机推荐

  1. MySQL触发器 trigger之after与before区分

    after:是先完毕数据的增删改,然后再触发.触发的语句晚于监视的增删改,无法影响前面的增删修改作.也就是说先插入订单记录.再更新商品数量.当商品数量少于订单数量时造成爆库. before:先完毕触发 ...

  2. MySQL性能监控工具-Spotlight on MySQL

    原文地址:http://blog.csdn.net/k_scott/article/details/8167018 这是我的第二款用于监控MySQL数据库性能的工具:Spotlight on MySQ ...

  3. Mysql命令行备份与还原数据库操作实例

    无论是Windows还是Linux,都可以通过如下命令行形式备份Mysql数据库 备份命令: 在windows的DOS窗口命令行或linux的shell命令行,假设需要备份的数据库是advanced: ...

  4. 【LeetCode】two num 利用comparable接口 对对象进行排序

    题目two num 题意:给定一个整数数组和一个目标值.要求在数组中找到两个数.使得它们的和相加等于目标值.而且返回两个数的下标 思路:1.假设使用暴力,时间复杂度为O(n^2) 2.能够先将全部数进 ...

  5. 辛星跟您玩转vim第二节之用vim命令移动光标

    首先值得一提的是,我的vim教程pdf版本号已经写完了,大家能够去下载.这里是csdn的下载地址:csdn下载.假设左边的下载地址挂掉了,也能够自行在浏览器以下输入例如以下地址进行下载:http:// ...

  6. C++语言基础(8)-引用

    (重要)使用引用的一些注意点: 1.引用不能绑定临时数据,也不能绑定任何无法获取内存地址的常量,表达式,或值,常引用除外. 第一种写法:(错误) int func_int(){ ; return n; ...

  7. 基于AFNetworking的网络判断【原创】

    首先导入AFNetworking第三方框架,然后将下面的.h和.m放在你新建的类中便可 GGNetworkJudge.h   在最后会有Singleton.h头文件代码 #import <Fou ...

  8. centos6 找不到 phpize

    安装php-devel yum install php-devel.i686

  9. linux设备树语法

    设备树语法及绑定 概述 Device Tree是一种用来描述硬件的数据结构,类似板级描述语言,起源于OpenFirmware(OF). 就ARM平台来说,设备树文件存放在arch/arm/boot/d ...

  10. 百度UEditor 用require 引入 Thinkphp5 ,图片上传问题

    用require引入,用了10分钟:上传图片,用了一个早上(吐血一地.....) 重点:require引入成功后,在需要引用UEditor的文件开头加入(ue的文件夹路径) window.UEDITO ...