amaze ui使用简介
amaze ui使用简介
amaze UI
类似于bootstrap
不过比bootstrap更加轻量级
可以用来开发响应式网站,并且是移动优先的,针对移动设备开发的网站可以考虑使用这个框架
css中的网格
首先要对框架的命名规则有所了解
然后自己在使用框架开发的过程中也根据框架的命名规则来给自己的代码命名
.am-g表示行
.am-u-sm-n表示列
比如am-u-sm/md/lg-n
这个类中 am是amaze的意思 u是unite的意思 可以理解成网格
sm代表small是手机屏幕
md是Middle 代表平板等的屏幕
lg是pc的屏幕 large的意思
n代表比例
n/12 整个屏幕被分成12份儿
-webkit是适用于safari或者chrome的
-moz是firfox的浏览器
通过网格系统可以做到
屏幕变小或者变大的时候
1.隐藏某一行
2.换列的比例
3.调整成两行
4.不变
等等
我在使用框架或者插件的时候遇到的一些问题:
1.JS在引用的时候应该注意引用的顺序,顺序不合适可能导致错误
比如 Jquery一般应该在别的js文件之前
因为别的js文件可能引用了JQ
2.注意选择器的优先级
3.IE浏览器debug注意下兼容模式与否,IE8,IE9,IE10,IE11
参考:
第一次使用框架-amaze UI - CSDN博客
https://blog.csdn.net/yoany/article/details/46907415
amaze ui使用简介的更多相关文章
- DoNet开源项目-基于Amaze UI的点餐系统
帮朋友做的点餐系统,主要是为了让顾客在餐桌上,使用微信扫描二维码,就可以直接点菜,吃完使用微信付款. 系统演示地址,账户名和密码均为:admin.(请不要删除admin用户) GitHub Clone ...
- 幻灯片插件FlexSlider -- Amaze UI幻灯片参数
用了Amaze UI 的人就知道,其幻灯片插件是 data-am-slider='{}'来传参数的:(以下代码来自Amaze UI 官网) <div data-am-widget="s ...
- 目前几款基于html5的前端框架:如Bootstrap、Foundation、Semantic UI 、Amaze UI
Bootstrap是由Twitter在2011年8月推出的开源WEB前端框架,集合CSS 和HTML,使用了最新的浏览器技术,为快速WEB开发提供了一套前端工具包,包括布局.网格.表格.按钮.表单.导 ...
- 有了bootstrap,为什么还要做amaze ui
1.Bootstrap介绍Bootstrap,来自 Twitter,是目前很受欢迎的前端框架.Bootstrap 是基于 HTML.CSS.JAVASCRIPT 的,它简洁灵活,使得 Web 开发更加 ...
- 移动端 前端框架 amaze ui
移动端 前端框架 amaze ui http://amazeui.org/?_ver=2.x
- Amaze UI 是一个移动优先的跨屏前端框架。 http://amazeui.org/
http://amazeui.org/ Amaze UI 是一个移动优先的跨屏前端框架.... Amaze UI 以移动优先(Mobile first)为理念,从小屏逐步扩展到大屏,最终实现所有屏幕适 ...
- 十、VueJs 填坑日记之在项目中使用Amaze UI
上一篇博文,我们把jQuery集成到了项目中,今天我们来集成Amaze ui(妹子UI).先来介绍一下妹子UI.Amaze UI 含近 20 个 CSS 组件.20 余 JS 组件,更有多个包含不同主 ...
- 十一、VueJs 填坑日记之使用Amaze ui调整列表和内容页面
上一篇博文我们整合了Amaze ui,并且调整了一个头部header和底部footer文件,其实做起来也很简单,只要按照步骤来做,完全没有问题.今天我们来重新调整一下列表页面和内容页面,使我们做的后台 ...
- amaze UI 笔记 - CSS
导航添加依据 http://amazeui.org/css/ 下面内容属学习笔记,如有理解偏差和错误请留言相告,感谢!* =(官网这块写的很详细) 一.基本样式 1.统一样式 说明了为什么使用Nor ...
随机推荐
- spring-data-redis 使用过程中需要注意的地方
1.序列化问题 <!-- SDR默认采用的序列化策略有两种,一种是String的序列化策略,一种是JDK的序列化策略. StringRedisTemplate默认采用的是String的序列化策略 ...
- ES6中includes、startsWith、endsWith
es6新增includes:返回布尔值,表示是否找到字符串.startsWith:返回布尔值,表示字符串是否在源字符串的头部位置.endsWith:返回布尔值,表示参数字符串是否在源字符串尾部. va ...
- ACM训练联盟周赛(第三场)
A.Teemo's bad day Today is a bad day. Teemo is scolded badly by his teacher because he didn't do his ...
- Functor& Monad解读
整体上代表封装的概念,重点是函数的封装,及函数运行的上下文环境.trait Functor[F[_]] Functor:代表整体封装: F[_]:代表封装后的目标域. A.B:代表普通的对象:f:代表 ...
- d3 bubble源码分析
技术 d3.d3.pack.d3.hierarchy 展示 https://bl.ocks.org/xunhanliu/e0688dc2ae9167c4c7fc264c0aedcdd1 关于怎么使用, ...
- POJ-2142 The Balance 扩展欧几里德(+绝对值和最小化)
题目链接:https://cn.vjudge.net/problem/POJ-2142 题意 自己看题吧,懒得解释 思路 第一部分就是扩展欧几里德 接下来是根据 $ x=x_0+kb', y=y_0- ...
- C#开发奇技淫巧二:根据dll文件加载C++或者Delphi插件
原文:C#开发奇技淫巧二:根据dll文件加载C++或者Delphi插件 这两天忙着把框架改为支持加载C++和Delphi的插件,来不及更新blog了. 原来的写的框架只支持c#插件,这个好做 ...
- springboot框架笔记——springboot提供的自动配置
Springboot基本配置 spring MVC的定制配置需要我们的配置实现一个WebMvcConfigurer接口,如果实在spring环境下需要使用@EnableWebMVC注解,来开启对spr ...
- 解读I/O多路复用技术
前言 当我们要编写一个echo服务器程序的时候,需要对用户从标准输入键入的交互命令做出响应.在这种情况下,服务器必须响应两个相互独立的I/O事件:1)网络客户端发起网络连接请求,2)用户在键盘上键入命 ...
- ECNUOJ 2616 游黄山
游黄山 Time Limit:1000MS Memory Limit:65536KB Total Submit:165 Accepted:52 Special Judge Description Po ...