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 ...
随机推荐
- 23.STL容器小结
- Spring MVC 核心架构图
架构图对应的DispatcherServlet核心代码如下: //前端控制器分派方法 protected void doDispatch(HttpServletRequest request, Htt ...
- uname---用于打印当前系统相关信息
uname命令用于打印当前系统相关信息(内核版本号.硬件架构.主机名称和操作系统类型等). 语法 uname(选项) 选项 -a或--all:显示全部的信息: -m或--machine:显示电脑类型: ...
- 紫书 习题 10-10 UVa 1645(递推)
除了根节点以外,有n-1个节点,然后就看n-1的因数有那些,所有因数加起来(递推)就好了. #include<cstdio> #define REP(i, a, b) for(int i ...
- ArcGIS api for javascript——图形-使用多个图形图层
描述 本例展示了如何增加多个图形图层到地图.一个图形图层显示国家,另一个显示城市.在一个地图中有多个图形图层的能力是在ArcGIS JavaScript API v1.4增加的. 从蓝色的城市点分隔灰 ...
- Java的几个有用小Util函数(日期处理和http)
/** * 依据日期返回当前日期是一年的第几天 * @param date * @return */ public static int orderDa ...
- Android入门篇(一)Androidproject的搭建,导入与导出,图标的改动
先说一些题外话吧.这是小珂同学的处女作.可能写的不好,请各位读者见谅.我先讲讲我为什么要写博文,那应该也是机缘巧合,有一次.我问学长一个问题,学长发了一个连接给我,里面是一篇博客.那时我仅仅是看 ...
- iBatis框架使用 4步曲
iBatis是一款使用方便的数据訪问工具,也可作为数据持久层的框架.和ORM框架(如Hibernate)将数据库表直接映射为Java对象相比.iBatis是将SQL语句映射为Java对象. 相对于全自 ...
- oracle_序列、索引、同义词
①序列 1.序列: 可供多个用户用来产生唯一数值的数据库对象 自己主动提供唯一的数值 共享对象 主要用于提供主键值 将序列值装入内存能够提高訪问效率 2.CREA ...
- IDEA中的maven web 项目中如何设置自己的本地仓库
我们在创建maven项目的时候如何不使用系统指定的本地仓库,而使用自己设置的仓库呢,这里小女子就来进行讲解一下吧! 讲解一:你要想找到settings.xml你就要自己我去官网上去下载apache-m ...