使用iview如何使左上的添加按钮和右上的搜索框和边框对齐呢?

效果如下:

使用iview自带的Grid 栅格进行布局,但是由于按钮和搜索框的大小不正好是一个栅格的宽度,所以不是很好跳转,且栅格也不支持百分数设置。

解决办法

默认栅格内的内容是左对齐的(这个可以设置)

然后让最右边的搜索框的宽度灵活设置为一个栅格宽度的倍数即可。(一个栅格的宽度 = div的总宽度 / 24)

使用iview如何使左上的添加按钮和右上的搜索框和边框对齐的更多相关文章

  1. Android开发 ---代码创建选项菜单、隐藏菜单项、菜单的生命周期,菜单按钮图标设置、搜索框、xml中设置子菜单

    1.activity_main.xml 描述: 定义了一个按钮 <?xml version="1.0" encoding="utf-8"?> < ...

  2. java 24 - 3 GUI之添加按钮

    需求:把按钮添加到窗体,并对按钮添加一个点击事件. A:创建窗体对象 B:创建按钮对象 C:把按钮添加到窗体 D:窗体显示 注意:这里对按钮添加点击事件,同样使用监听器. 但是,这里的按钮是组件,所以 ...

  3. 关于FlexPaper 2.1.2版本 二次开发 Logo 、打印、搜索、缩略图、添加按钮、js交互、右键菜单、书签等相关问题

    2015-03-02 更新文章,由于需求修改,更改了flexpaper插件,故增加第9.10.11小节,下载代码时请注意. 先废话几句.最近用到文档在线浏览功能,之前用的是print2flash(一个 ...

  4. 如何往IE工具条添加按钮(转载)

    如何往IE工具条添加按钮 问题提出:金山词霸.网络蚂蚁等软件安装后会向IE的工具条添加自己的按钮.按下按钮后还会作出相应的动作,这种功能是如何实现的呢?读完本文,您也可以将自己应用程序的按钮添加到IE ...

  5. stark组件开发之添加按钮显示和URL

    添加: 需求: 根据用户的权限, 决定是否,有添加按钮.  通过配置进行定制,预留钩子进行权限的判断. class StartHandler(object): .................... ...

  6. MFC中 在SDI模式下的视图中添加按钮的方法

    在单文档视图(SDI)结构中,视图一般用来显示数据.但是,有时也希望在视图中显示按钮或其他的控件,以满足用户的需要.下面是手动添加按钮并使按钮具有响应事件的功能的方法. 第一步:添加一个按钮      ...

  7. iOS 封装添加按钮的方法

    添加按钮 #pragma mark 添加按钮 - (void)addButtonWithImage:(NSString *)image highImage:(NSString *)highImage ...

  8. 今天遇到的点击添加按钮button_click代码段无法执行的问题

    首先:本人小白一枚,刚入行,如有表述不当的地方,还请多多指教 网页界面如图: 当点击添加按钮后断点测试进入后台代码运行: 代码会先执行Page_Load页面,当加载完后Page_Load代码会跳转到m ...

  9. iOS开发UI篇—在UIImageView中添加按钮以及Tag的参数说明

    ios开发UI篇—在ImageView中添加按钮以及Tag的参数说明 一.tag参数 一个视图通常都只有一个父视图,多个子视图,在开发中可以通过使用子视图的tag来取出对应的子视图.方法为Viewwi ...

随机推荐

  1. vuex:使用思路总结

    1. vuex是什么? 是一种数据状态管理机制. 2.vuex的构成和作用: state: 存放需要被管理的属性的对象 getters: 方便在state中做集中处理,可以把state作为第一个参数 ...

  2. 梁勇 java教材 编程练习题 第二章 2.6 键盘 读取一个在0 到 9999 之间的整数,并将该整数的各位数字相加。

    import java.util.Scanner; /** * 需求:从键盘输入任意0~9999之间的整数,输出这个整数各位数字之和. * 思路:方法一,使用扫描器Scanner类,扫描控制台输入流 ...

  3. JS时间格式和时间戳的相互转换

    时间戳转化为日期的方式 ; var newDate = new Date(); newDate.setTime(timestamp * ); // Mon May 28 2018 console.lo ...

  4. swoole 连接池

    proxy_pool.php <?php class ProxyServer { protected $frontends; protected $backends; /** * @var sw ...

  5. tcl之string操作-match/map/大小写转换

  6. usb gadge驱动设计之我是zero

    此处将以zero.c为例进行讲解. 第一次接触zero.c驱动的时候,是因为某项目需要,提供一种usb字符设备,希望能够通过字符设备打开,读取和发送文件.当时能想到的就是zero.c文件,本打算按照z ...

  7. 初识java,编写hello world语句

    JDK: Java Develpment Kit - java开发工具包 JRE: Java Runtime Environment - java运行环境 JVM: Java Virtual Mach ...

  8. 设计模式之第19章-中介者模式(Java实现)

    设计模式之第19章-中介者模式(Java实现) “测试妹纸找你,你的代码出问题了.”“美工妹纸让你看看界面怎么样.”身为程序员总要和各种人打交道,但是如果再分为前端.后端工程师的话,那么关系就会错综复 ...

  9. github readme.md 添加图片

    简要: 将图片放在仓库里面,在文件里链接它,最后 push 到 github 上. github 图片链接格式: (http://github.com/yourname/your-repository ...

  10. Python + Selenium 自动化环境搭建过程

    1.  所需组建 1.1  Selenium for python 1.2  Python 1.3  Notepad++ 作为刚初学者,这里不建议使用Python IDE工具,选择一个功能强大的记事本 ...