写移动端怎么会不用到框架呢？

现在比较火的是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框架----移动端页面在所有屏幕下自适应的更多相关文章

  1. mui框架如何实现页面间传值

    mui框架如何实现页面间传值 我的传值 listDetail = '<li class="mui-table-view-cell mui-media>">< ...

  2. 移动端页面按手机屏幕分辨率自动缩放的js

    <script> var phoneWidth = parseInt(window.screen.width); var phoneHeight = parseInt(window.scr ...

  3. 跨平台移动端APP开发---简单高效的MUI框架

    MUI是dcloud(数字天堂)公司旗下的一款跨平台开发移动APP的框架产品,在学习MUI框架之前,最先接触了Hbuilder代码编辑器,它带给我的第一感觉是快,这是HBuilder的最大优势,通过完 ...

  4. MUI框架-02-注意事项-适用场景-实现页面间传值

    MUI框架-02-注意事项-适用场景-实现页面间传值 关于开发,我拷贝太多也没什么意义,就请查阅:官方文档:http://dev.dcloud.net.cn/mui/ui/ 快速入门 - 注意事项 有 ...

  5. mui框架（一）

    1.界面初始化 初始化就是把一切程序设为默认状态,把没准备的准备好. mui框架将很多功能配置都集中在mui.init方法中,要使用某项功能,只需要在mui.init方法中完成对应参数配置即可,目前支 ...

  6. 移动端 mui框架中input输入框或任何输入框聚焦后页面自动上移

    一.mui框架中点击input后,安卓手机弹出自带的输入键盘时,页面自动上移 实现方法: (1)只要把input标签放在mui-content这个类里面就可以了 <div class=" ...

  7. 初入APP（结合mui框架进行页面搭建）

      前  言 博主最近在接触移动APP,学习了几个小技巧,和大家分享一下. 1. 状态栏设置 现在打开绝大多数APP,状态栏都是与APP一体,不仅美观,而且与整体协调.博主是个中度强迫症患者,顶部那个 ...

  8. MUI框架开发HTML5手机APP(二)--页面跳转传值&底部选项卡切换

      概 述 JRedu 在上一篇博客中,我们学习了如何使用Hbuilder创建一个APP,同时如何使用MUI搭建属于自己的第一款APP,没有学习的同学可以戳链接学习: http://www.cnblo ...

  9. MUI框架-10-MUI 数据交互-跳转详情页面

    MUI框架-10-MUI 数据交互-跳转详情页面 上一篇介绍了如何实现数据交互,给别人的 API 发送 ajax 请求,我们得到数据,再使用 art-template 模板引擎拼接 HTML,最终实现 ...

随机推荐

  1. 纯CSS二级纵向菜单

    纯CSS二级纵向菜单 <body> <div class="divda"> <div class="nav"> <ul ...

  2. and,or

    where语句的and or 连接 $map['_logic'] = 'and'; $map['_logic'] = 'or';

  3. 10个优秀个android项目，精选|快速开发

    1.Android-FilePicker-android图片和文档选择器 项目地址 https://github.com/DroidNinja/Android-FilePicker 2.ViewPag ...

  4. linux无密码连接

    先确保所有主机的防火墙处于关闭状态. 在主机A上执行如下: 1. $cd ~/.ssh 2. $ssh-keygen -t rsa  -----然后一直按回车键,就会按照默认的选项将生成的密钥保存在. ...

  5. 编程范式：命令式编程(Imperative)、声明式编程(Declarative)和函数式编程(Functional)

    主要的编程范式有三种:命令式编程,声明式编程和函数式编程. 命令式编程: 命令式编程的主要思想是关注计算机执行的步骤,即一步一步告诉计算机先做什么再做什么. 比如:如果你想在一个数字集合 collec ...

  6. 【读书笔记】【深入理解ES6】#3-函数

    函数形参的默认值 ES6中的默认参数值 function makeRequest(url, timeout = 2000, callback = function() {}) { } 可以为任意参数指 ...

  7. echart(2),模拟数据导入篇

    先上图,就是介样子的: 所模拟的效果就是讲左下角的li里面的数据取出来,然后用环形图的展示出数据. 看代码截图: 1.总的框架图: 2.循环取数据的js代码: 3.echart提供额官方api的代码 ...

  8. 读了前半本<Thinking in Java>

    读了1-14章.这本书真的不适合初学者,可能比较适合有一两年Java经验的人来读.学习真的是一个螺旋递进的过程.刚开始学Java基本语法,书上看到的很多东西觉得过于细枝末节,没见过,用不上,导致书看不 ...

  9. ubuntu下查看-卸载软件(卸载.net core sdk的方法)

    查看已安装的包:dpkg --list 查看正则匹配的包:dpkg --list 'dotnet-*' //查看以dotnet-开头的包 卸载匹配的包:sudo apt-get --purge rem ...

  10. [hdu3943]K-th Nya Number

    挺正常的一道模板题. f[i][j][k]表示i位的数,有j个4,k个7的方案数. 具体实现的话...我写了发二分答案..需要注意的是二分时应该是mid=L+(R-L)/2..不然分分钟爆longlo ...