MUI学习01-MUI概括、使用前引入CSS及JS

时间:2022-09-18 07:57:28

1、MUI含义

目标:追求性能体验,追求原生UI感觉

重要特征:轻量

优势:MUI不依赖任何第三方JS库,压缩后的JS和CSS文件仅有100+K和60+K

基础:MUI以iOS平台UI为基础,补充部分Android平台特有的UI控件


2、下载Hello mui App

下载地址:https://github.com/dcloudio/mui   ——绿色按钮

MUI学习01-MUI概括、使用前引入CSS及JS

MUI学习01-MUI概括、使用前引入CSS及JS

MUI学习01-MUI概括、使用前引入CSS及JS


3、 mui 文档

mui官网:http://dev.dcloud.net.cn/mui/ui/


正式使用步骤:

步骤1:在<head>内写入meta及mui.css

<head>
<meta charset="utf-8" />
<title>农业大棚智能监控系统-实时监控</title>
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<link rel="stylesheet" href="../css/mui.min.css">
<style type="text/css">
#list {
/*避免导航边框和列表背景边框重叠,看起来像两条边框似得;*/
margin-top: -1px;
}
</style> </head>
meta 说明:http://www.cnblogs.com/pigtail/archive/2013/03/15/2961631.html

步骤1:在</body>前引入mui.min.js
<script src="js/mui.min.js"></script>

以上都是个人在网上搜索,个人整理,方便记忆。

MUI学习01-MUI概括、使用前引入CSS及JS的更多相关文章

  1. Django2&period;0引入css、js、img文件

    Django2.0引入css.js.img文件 一.文件结构 二.settings.py的配置 # Static files (CSS, JavaScript, Images) # https://d ...

  2. Thymeleaf模版--子页面单独引入CSS、JS文件

    https://blog.csdn.net/u010392801/article/details/80465800 ****************************************** ...

  3. 使用时间戳引入css、js文件

    前言 最近在一家创业公司实习,主要负责新版官网和商家平台管理系统的前端开发和维护,每次测试都要上传文件到ftp服务器端测试,初期由于更新修改比较频繁,每次都是直接上传覆盖css.js.php文件,链接 ...

  4. 在html中引入css、js和jQuery的方法

    在html中引入css代码 在html中插入CSS样式表的方法有三种: 1.外部样式表(External style sheet):即所有的样式单独写在一个.css文件中,在html文件的head部分 ...

  5. laravel V层引入css 和js方法

    引入css  默认引入public目录 <link rel="stylesheet" href="{{URL::asset('css/xxx.css')}}&quo ...

  6. vue引入css和js的方法

    1.引入js的话 require('地址') imgport xxx from ‘src’ import xxx 2.引入css @import ‘  ’

  7. 在vue项目npm run build后,index&period;html中引入css和js 报MIME type问题

    问题: 1.在vue项目中,build打包后,index页面打开会报错, MIME type ('text/html') ;报错内容:because its MIME type ('text/html ...

  8. phalcon&colon; 资源文件管 理 引入css,js

    <?php class IndexController extends Phalcon\Mvc\Controller { public function index() { //添加本地css资 ...

  9. HTML链接式引入CSS和JS

    <!-调用CSS-> <link href="./XXXXX.css" rel="stylesheet" type="text/cs ...

随机推荐

  1. spring HandlerInterceptorAdapter拦截ajax异步请求,报错ERR&lowbar;INCOMPLETE&lowbar;CHUNKED&lowbar;ENCODING

    话不多说,直接上正文. 异常信息: Failed to load resource: net::ERR_INCOMPLETE_CHUNKED_ENCODING 问题描述: 该异常是在页面发送ajax请 ...

  2. salesforce 零基础学习(二十四)解析csv格式内容

    salesforce中支持对csv格式的内容批量导入,可以使用dataloader,然而有些情况下,当用户没有相关权限使用dataloader导入情况下,就的需要使用VF和apex代码来搞定. 基本想 ...

  3. android 权限大全

    教程 博客 淘帖     论坛›eoe·Android开发资源区›Android开发实例教程 191507 12 / 2 页下一页 android 权限大全 『癲瘋霸気』 于 2013-4-3 10: ...

  4. Mes首检确认统计的存储过程

    USE [ChiefmesNEW]GO/****** Object: StoredProcedure [dbo].[st_MES_RptInspectFirstCollect] Script Date ...

  5. Tenth Line

    How would you print just the 10th line of a file? For example, assume that file.txt has the followin ...

  6. Monad

    Monad英文含义,单体.单分子.单细胞. Monad是一种设计模式,表示将一个运算过程,通过函数拆解成互相连接的多个步骤.你只要提供下一步运算所需的函数,整个运算就会自动进行下去.

  7. Elasticsearch&period;安装插件(head)

    Elasticsearch.安装插件(head) 环境: Linux 7.x jdk1.8 目录结构(跟目录多了两个文件) /resources   ### 存放软件源 /u01/          ...

  8. Python自学&colon;第三章 使用del语句删除元素

    motorcycles = ["honda", "yamaha", "suzuki"] print(motorcycles) del mot ...

  9. Docker网络的基本功能操作示例

    一.Docker常用的四种网络模型 1.第一种:使用网络名称空间,但不设置任何网络设备 这种模型中只有lo接口,是一个封闭式的容器,不能与外界进行通信.设置网络模型需要使用 --network 选项来 ...

  10. Java NIO4:缓冲区Buffer&lpar;续&rpar;

    一.什么是缓冲区      一个缓冲区对象是固定数量的数据的容器,其作用是一个存储器,或者分段运输区,在这里数据可被存储并在之后用于检索.缓冲区像前篇文章讨论的那样被写满和释放,对于每个非布尔原始数据 ...