要实现的效果:

wxml端代码:


<view  class="prepare_param">
                        <view class="prepare_confirm1">
                            <button size="mini" type="primary" bindtap="deleteById" data-id="{{item.id}}">作废</button>
                        </view>
                        <navigator class="prepare_confirm2"  url="/pages/prepare_addAndEdit/index?prepare_id={{item.id}}&supplyId={{item.supplyId}}">
                            <button size="mini" type="primary">修改</button>
                        </navigator>
                    </view>

样式代码

.prepare_param {
.prepare_confirm1{
padding-left: 350rpx;
} .prepare_confirm2{
width: 150rpx;
float: right;
}
}

分析:

将一个div分成两部分,将右侧的按钮的宽度设置成略大于按钮本身的宽度,并让整个div移动到最右端。剩余的宽度为左侧按钮所在div的总宽度,此时设置padding-left的宽度,实现

让左侧按钮无限接近右侧按钮

微信小程序:如何实现两个按钮在最右侧并排的更多相关文章

  1. 微信小程序picker组件两列关联使用方式

    在使用微信小程序picker组件时候,可以设置属性   mode = multiSelector   意为多列选择,关联选择,当第一列发生改变时侯,第二列甚至第三列发生相应的改变.但是官方文档上给的只 ...

  2. 微信小程序 自定义单选复选按钮组的实现(用于实现购物车产品列表功能)

    (一)单选按钮组 模型图如下: index.js Page({ data: { parameter: [{ id: 1, name: '银色' }, { id: 2, name: '白色' },{ i ...

  3. 微信小程序一个页面多个按钮分享怎么处理

    首先呢,第一步先看api文档: 组件:button https://developers.weixin.qq.com/miniprogram/dev/component/button.html 框架- ...

  4. 微信小程序踩坑集合

    1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=1476434678461 2:简易教程:https://mp.weixin.qq.com/debu ...

  5. 关于微信小程序的一些总结

    mpvue? {{}} 在vue和小程序中的区别? 01 小程序中{{}}和vue中的{{}}用法基本一致,可以显示data中的数据,可以写表达式 不一样的地方? 01 小程序的{{}}可以写在属性中 ...

  6. 微信小程序之onLaunch与onload异步问题

    所述问题: 前端时间开发了一个微信小程序商城项目,因为这个项目我们的需求是进入小程序就通过wx.login({}) 这个api进行用户登录,获取系统后台的用户基本信息.再此之前,一直以为微信小程序中的 ...

  7. 微信小程序 View:flex 布局

    微信小程序 View 支持两种布局方式:Block 和 Flex 所有 View 默认都是 block 要使用 flex 布局的话需要显式的声明: display:flex; 下面就来介绍下微信小程序 ...

  8. 实时视频直播客户端技术盘点:Native、HTML5、WebRTC、微信小程序

    1.前言 2017 年 12 月,微信小程序向开发者开放了实时音视频能力,给业内带来广阔的想象空间.连麦互动视频直播技术在 2016 年直播风口中成为视频直播的标配,然而只有在原生的 APP 上才能保 ...

  9. 微信小程序—setTimeOut定时器的坑

    原文地址: http://fanjiajia.cn/2018/06/27/%E5%BE%AE%E4%BF%A1%E5%B0%8F%E7%A8%8B%E5%BA%8F%E2%80%94setTimeOu ...

随机推荐

  1. H3C交换机端口聚合配置

    1.接入交换机: interface Ten-GigabitEthernet1/0/21 port link-mode bridge port link-type trunk port trunk p ...

  2. 使用timeout-decorator为python函数任务设置超时时间

    需求背景 在python代码的实现中,假如我们有一个需要执行时间跨度非常大的for循环,如果在中间的某处我们需要定时停止这个函数,而不停止整个程序.那么初步的就可以想到两种方案:第一种方案是我们先预估 ...

  3. Joomla 3.4.6 RCE复现及分析

    出品|MS08067实验室(www.ms08067.com) 本文作者:whojoe(MS08067安全实验室SRST TEAM成员) 前言 前几天看了下PHP 反序列化字符逃逸学习,有大佬简化了一下 ...

  4. Scala集合库、模式匹配和样例类

    package com.yz8 import org.junit.Test class test { @Test def test: Unit = { val ints = List(1,5,7,6, ...

  5. P4718 [模板]Pollard-Rho算法

    对一个大质数进行质因数分解 需要引用miller-robin来判素数 一直写的gcd居然挂掉了... 以后用__gcd了 #include <bits/stdc++.h> using na ...

  6. 第 45 届国际大学生程序设计竞赛(ICPC)亚洲网上区域赛模拟赛. A.Easy Equation (前缀和/差分)

    题意:RT,给你四个数\(a,b,c,d\),求\(x+y+z=k\)的方案数. 题解:我们可以先枚举\(x\)的值,然后\(x+y\)能取到的范围一定是\([x,x+b]\),也就是说这个区间内每个 ...

  7. Cobbler服务引导第三方PE系统

    通过Cobbler服务引导第三方PE系统 1.上传第三方ios到/root/Ushendu_win10.iso并增加菜单项 cobbler distro add --name=Ushendu_win1 ...

  8. 2.安装Helm

    作者 微信:tangy8080 电子邮箱:914661180@qq.com 更新时间:2019-06-25 13:54:15 星期二 欢迎您订阅和分享我的订阅号,订阅号内会不定期分享一些我自己学习过程 ...

  9. codeforces 758D

    D. Ability To Convert time limit per test 1 second memory limit per test 256 megabytes input standar ...

  10. 洛谷p2216 多次单调队列,扫描矩阵中的最大值减去最小值最的固定大小子矩阵

    #include <iostream> #include <cstdio> #include <cstring> using namespace std; int ...