metronic

metronic是一个基于Bootstrap3.x的高级管理控制面板主题。是一套基于TwitterBootstrap3.3.4框架开始的多功能响应式后台管理和前台开发模板，一个完全响应式管理模板。基于Bootstrap3框架。高度可定制的，易于使用。适合从小型移动设备到大型台式机很多的屏幕分辨率。包含7个主题，高达100个左右的实例页面，非常丰富页面展示效果，包括表单，表格，地图，日历…等等。

metronic可用于任意类型的网页应用：

Metronic可以用于各种形式的网站程序，如管理员后台，管理仪表，电子商务后台，CMS，CRM，SAAS，公司网站，电商网站，商务网站，信息展示站，博客等。Metronic的时尚，干净，扁平化的设计，可以让你的网站看起来很友好，很吸引人。Metronic模板包含了大量的插件和UI元素，并且可以在主流浏览器和平板设备，智能设备正常显示。

浏览器兼容：iE8,IE9,IE10,IE11,Firefox,Safari,Opera,Chrome

对比了其他Bootstrap定制的影响式模版，这个功能与插件比较丰富。感觉大同小异如（免费的-AdminLTE）

我很少做前端开发，本文是作为笔记和共同学习的过程。请读者读时勿偏激。可能会颠覆你的前端观念

软件准备：VS2013

用途和保障

主要用途：一体化的管理模版，构建管理系统后台，如CMS,HR,OA等管理系统必备。花俏的软件比界面死板的同等软件价格可卖出高达40%

能合并到所有语言前端，包括主流asp.net,JSP,PHP

（源源不断的Bootstrap和Metronic作为更新技术支持，除非推兔团队解散）

目录

按目录名称可以看出包含了文档（documentation），资源（resources），开始(start)，主题(theme与theme_trl)，说明readme.txt

打开readme我们可以看到我们只需要用theme这个文件夹即可。theme_rtl支持RTL，RTL颠覆我的编程习惯。

可以依次运行theme--templates--adminX下的index效果。

然并卵，发现每一个admin对应了admin_material_design，根据readme说明admin_material_design是对应AngularJS版本的，不知道说得对比。

不懂AngularJS所以我们只用到正常版本的adminX

以上是部分截图。右边的设置可以设置布局的方式

把浏览器缩小看看平板下的效果同样非常不错。

全功能列表

干净的，直观的和完全响应的Metro风格的设计（在所有主要浏览器，是平板电脑和）

500+有效的模板页面

Bootstrap3.3.5框架

jQuery1.10.2

6种颜色的主题

全Sass支持

完整的RTL支持

开发者友好的代码

谷歌OpenSans字体

语言切换栏

多级菜单

卧式巨型菜单

电子商务

仪表板

订单

秩序观

产品

产品编辑

布局

固定的默认标题的布局

显示/隐藏侧边栏

横侧边栏菜单

横向菜单的网页实例

多用电子邮件模板

通过AJAX加载内容

侧边栏关闭页面示例

侧边栏固定页面实例

空白页的例子

盒装页面示例

非响应盒装的页面布局

用户界面功能

自定义标签和手风琴

地铁风格的按钮、表单元素

glyphicons一体化

字体（字体真棒真棒图标用3.2.0版）

图表（jQuery上）

圆刻度盘（jQuery旋钮）

地铁时尚的滑块（jQueryUI）

单选按钮和复选框的Metro风格（jQuery均匀）

粘粘的通知（jQuery的交流）

脉动

自定义切换按钮（启动按钮）

jQueryUI模型

Windows8风格瓷砖

toastr通知

集成的树视图（引导树）

集成的嵌套列表（jQuery嵌套）

离子范围滑块

noui范围滑块

圆刻度盘旋钮

用户界面的进度条（jQueryblockUI）

标签输入（jQuery标签输入）

形式的东西

日期选择器（引导日期选择器）

时间选择器（引导时间选择器）

钟面时间选择器（引导钟面时间选择器）

日期范围选择器（引导日期范围选择器）

颜色选择器（引导颜色选择器）

2下拉菜单选择

自定义选择下拉（引导选择）

多重选择

自举开关

纺纱

IP地址输入

输入掩码

标签输入

先进的文件输入

集成WYSIWYG编辑器（引导wysihtml5和CKEditor）

无限的表单控件

推进形式布局（2列，加边，行行分离，剥离，标签剥离）

推进形式验证（jQuery表单验证插件）

形式x-editable

表单向导

图像的裁剪

多文件上传

悬浮窗文件上传

组件形式

网页

促销页面

博客列表

博客

新闻列表

新闻发布

Metro风格的时间表

投资组合页面

关于我们

我们

常见问题

即将上市

锁屏

综合全日历（jQuery完整的日历）

Tags:metronic,Bootstrap.