怎么快速写好看的手机menu菜单

要达到这样的效果:
<div class="menu">
<div class="menu-1">
<img alt="" src="img/ico_kh@3x.png"><br>
<span class="menuLabel">立即开户</span>
</div>
<div class="menu-1">
<img alt="" src="img/ico_sm@3x.png"><br>
<span class="menuLabel">扫码开户</span>
</div>
<div class="menu-1">
<img alt="" src="img/ico_yy@3x.png"><br>
<span class="menuLabel">预约开户</span>
</div>
<div class="menu-1">
<img alt="" src="img/ico_zd@3x.png"><br>
<span class="menuLabel">账单</span>
</div>
</div>
.menu{
height:100px;
width:100%;
text-align: center;
}
.menu-1{
float:left;
width:25%;
margin-top:20px;
}
.menu-1 img{
width:45px;
}
.menuLabel {
margin-top: 5px;
display: block;
font-size: 13px;
color: #000;
}
怎么快速写好看的手机menu菜单的更多相关文章
- android简洁饼状图组件、圆形Menu菜单、画板画笔应用、答题应用等源码
Android精选源码 android自动监听复制内容源码 Android上简洁轻量级的饼图控件 好看的 Android 圆形 Menu 菜单效果 android画笔.画板功能效果的实现 Androi ...
- 安卓开发笔记——Menu菜单组件(选项菜单,上下文菜单,子菜单)
菜单是用户界面中最常见的元素之一,使用非常频繁,在Android中,菜单被分为如下三种,选项菜单(OptionsMenu).上下文菜单(ContextMenu)和子菜单(SubMenu). 菜单的实现 ...
- IDEA最常用快捷键汇总+快速写出Main函数
IDEA可以说是当下Java程序员日常开发的神器,但是想要发挥这款神器的牛逼威力,必须得熟练使用它的各种快捷键才行.本篇总结下使用IDEA(也就是IntelliJ IDEA )进行日常开发中最常用的快 ...
- Android开发中的menu菜单
复写onCreateOptionsMenu方法,当点击menu菜单时,调用该方法. @Override public boolean onCreateOptionsMenu(Menu menu) { ...
- SharePoint 2013 激活标题字段外的Menu菜单
前言 SharePoint 有个很特别的字段,就是标题(Title)字段,无论想要链接到项目,还是弹出操作项目的菜单,都是通过标题字段,一直以来需要的时候,都是通过将标题字段改名进行的. 其实,Sha ...
- Ecshop 后台增加一个左侧列表菜单menu菜单的方法
Ecshop 后台增加一个左侧列表菜单menu菜单需要修改三个文件:/admin/includes/inc_menu.php/admin/includes/inc_priv.php/languages ...
- [转]ExtJs4 笔记(13) Ext.menu.Menu 菜单、Ext.draw.Component 绘图、Ext.resizer.Resizer 大小变更
作者:李盼(Lipan)出处:[Lipan] (http://www.cnblogs.com/lipan/)版权声明:本文的版权归作者与博客园共有.转载时须注明本文的详细链接,否则作者将保留追究其法律 ...
- 后台增加一个左侧列表菜单menu菜单的方法
Ecshop 后台增加一个左侧列表菜单menu菜单需要修改三个文件:/admin/includes/inc_menu.php/admin/includes/inc_priv.php/languages ...
- node-webkit教程<>Native UI API 之Menu(菜单)
node-webkit教程(6)Native UI API 之Menu(菜单)1 前言... 2 6.1 Menu 概述... 3 6.2 menu api6 6.2.1 new Menu([o ...
随机推荐
- Nginx-rtmp之 ngx_rtmp_send.c 文件分析
1. 简述 1.1 RTMP 消息类型 /* RTMP message types */ #define NGX_RTMP_MSG_CHUNK_SIZE 1 #define NGX_RTMP_MSG_ ...
- Why are C# structs immutable?
Compiler Error CS1612 Cannot modify the return value of 'expression' because it is not a variable cl ...
- TP框架如何绑定参数。目的进行ajax验证
TP框架的自动绑定 对于某些操作的情况(例如模型的写入和更新方法),可以支持参数的自动绑定,例如: 首先需要开启DB_BIND_PARAM配置参数: 'DB_BIND_PARAM' => tru ...
- ZT:我们身边大多数的事都是暂时性的
1. 家庭放在首位. 2. 戒酒能有助于身体健康. 3. 经常跑步以及运动有益于身心健康. 4. 保证心胸开阔.让爱自动来到你的身边,而不需要你自己去拼命寻找. 5. 区分优秀的导师和老师.不断提升自 ...
- 转载:一文详解SQL解析与应用
转载地址:http://www.elecfans.com/emb/20180618696111.html 数据库作为核心的基础组件,是需要重点保护的对象.任何一个线上的不慎操作,都有可能给数据库带来严 ...
- append和push和pop区别
append() 操作的是DOM节点,在被选元素的结尾(内部结尾)插入指定内容: push() 向数组末尾插入一个或者多个元素,并且返回新的长度: pop() 删除 ...
- LC 245. Shortest Word Distance III 【lock, medium】
Given a list of words and two words word1 and word2, return the shortest distance between these two ...
- Fiddler Wireshark 抓包
使用 层次 Fiddler 简单 第七层应用层的 HTTP(S) 协议的包 Wireshark 复杂 第三层网络层的包 注意:Fiddler 只能抓到走系统代理的流量.不走系统代理的流量(比如浏览器选 ...
- Breadcrumb 面包屑
显示当前页面的路径,快速返回之前的任意页面. 基础用法 适用广泛的基础用法. 在el-breadcrumb中使用el-breadcrumb-item标签表示从首页开始的每一级.Element 提供了一 ...
- java源码-ReentrantLock源码分析-2
继续上篇ReentrantLock分析如何唤醒线程: 当调用lock.unlock()方法最终调用AQS类中的release方法,开始释放锁 tryRelease(1)方法在Sync对象中实现,首先会 ...