使用mui框架----移动端页面在所有屏幕下自适应
写移动端怎么会不用到框架呢?
现在比较火的是mui、amaze UI 之类的,mui是现在最灵活轻便的一个框架,能够从pc到移动灵活的自适应,
只需要调用他定义的类名就能使用,非常方便,只是需要自己来查找、更改样式
页面如下
head标签内引入mui css 、mui js
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<link href="css/mui.min.css" rel="stylesheet" />
<link href="css/个人订单.css" rel="stylesheet" />
<script src="js/mui.min.js"></script>
html(mui框架以mui-为固定命名,使用的是grid栅格系统,全部内容使用mui-content包裹)
mui-col-sm-12:在<400的屏幕下站12格满屏;
mui-col-xs-12:在>400的屏幕下占12格满屏;
nav菜单
内容 在大屏和小屏都占12格,永远是自适应
使用mui框架----移动端页面在所有屏幕下自适应的更多相关文章
- mui框架如何实现页面间传值
mui框架如何实现页面间传值 我的传值 listDetail = '<li class="mui-table-view-cell mui-media>">< ...
- 移动端页面按手机屏幕分辨率自动缩放的js
<script> var phoneWidth = parseInt(window.screen.width); var phoneHeight = parseInt(window.scr ...
- 跨平台移动端APP开发---简单高效的MUI框架
MUI是dcloud(数字天堂)公司旗下的一款跨平台开发移动APP的框架产品,在学习MUI框架之前,最先接触了Hbuilder代码编辑器,它带给我的第一感觉是快,这是HBuilder的最大优势,通过完 ...
- MUI框架-02-注意事项-适用场景-实现页面间传值
MUI框架-02-注意事项-适用场景-实现页面间传值 关于开发,我拷贝太多也没什么意义,就请查阅:官方文档:http://dev.dcloud.net.cn/mui/ui/ 快速入门 - 注意事项 有 ...
- mui框架(一)
1.界面初始化 初始化就是把一切程序设为默认状态,把没准备的准备好. mui框架将很多功能配置都集中在mui.init方法中,要使用某项功能,只需要在mui.init方法中完成对应参数配置即可,目前支 ...
- 移动端 mui框架中input输入框或任何输入框聚焦后页面自动上移
一.mui框架中点击input后,安卓手机弹出自带的输入键盘时,页面自动上移 实现方法: (1)只要把input标签放在mui-content这个类里面就可以了 <div class=" ...
- 初入APP(结合mui框架进行页面搭建)
前 言 博主最近在接触移动APP,学习了几个小技巧,和大家分享一下. 1. 状态栏设置 现在打开绝大多数APP,状态栏都是与APP一体,不仅美观,而且与整体协调.博主是个中度强迫症患者,顶部那个 ...
- MUI框架开发HTML5手机APP(二)--页面跳转传值&底部选项卡切换
概 述 JRedu 在上一篇博客中,我们学习了如何使用Hbuilder创建一个APP,同时如何使用MUI搭建属于自己的第一款APP,没有学习的同学可以戳链接学习: http://www.cnblo ...
- MUI框架-10-MUI 数据交互-跳转详情页面
MUI框架-10-MUI 数据交互-跳转详情页面 上一篇介绍了如何实现数据交互,给别人的 API 发送 ajax 请求,我们得到数据,再使用 art-template 模板引擎拼接 HTML,最终实现 ...
随机推荐
- iOS微信运动 刷分
修改 iOS微信运动的数据 很简单,这里记录下实现步骤. 首先要安装Theos,具体安装步骤就不说了.网上很多. 大体安装步骤: sudo brew install dpkg sudo brew i ...
- sublime自动保存(失去焦点自动保存)
sublime是轻量的编辑器,经常用sublime编辑器来做一些小例子,使用起来很方便. 在使用sublime的时候需要不断的 ctrl + s 保存代码,才能看到效果. 这样的操作很繁琐,保存的多了 ...
- Python模块学习---Web
import urlparse url = urlparse.urlparse("http://www.python.org/doc/FAQ.html") print url pr ...
- Mysql无法启动 InnoDB: Attempted to open a previously opened tablespace
win2008,Mysql5.6,mysql服务无法启动 查看事件日志,报错InnoDB: Attempted to open a previously opened tablespace 最终解决方 ...
- [小程序开发] 微信小程序audio音频播放组件+api_wx.createAudioContext
引言: audio是微信小程序中的音频组件,可以轻松实现小程序中播放/停止音频等自定义动作. 附上微信小程序audio组件的相关属性说明:https://mp.weixin.qq.com/debug/ ...
- Flask-SQLAlchemy
Flask-SQLAlchemy SQLAlchemy 一. 介绍 SQLAlchemy是一个基于Python实现的ORM框架.该框架建立在 DB API之上,使用关系对象映射进行数据库操作,简言 ...
- python与ssh交互
由于pexpect模块在windows上不能运行,官方给出的. 所以我使用了paramiko模块进行我们的交互. 我的linux是Debian Kali Linux 64位 首先我们要进vim的/et ...
- CSS position: absolute、relative定位问题详解
CSS2.0 HandBook上的解释: 设置此属性值为 absolute 会将对象拖离出正常的文档流绝对定位,而不考虑它周围内容的布局.假如其他具有不同 z-index 属性的对象已经占据了给定的 ...
- Ugly Numbers(STL应用)
题目链接:http://poj.org/problem?id=1338 Ugly Numbers Time Limit: 1000MS Memory Limit: 10000K Total Sub ...
- class 文件反编译器的 java 实现
最近由于公司项目需要,了解了很多关于类加载方面的知识,给项目带来了一些热部署方面的突破. 由于最近手头工作不太忙,同时驱于对更底层知识的好奇与渴求,因此决定学习了一下 class 文件结构,并通过一周 ...