来源:GBin1.com

UIkit是YOOtheme团队开发的开源的前端UI界面框架,可以帮助你快速的开发和创建前端UI界面。

基于下列开源项目:

  • LESS
  • jQuery
  • normalize.css
  • FontAwesome

主要特性

  • 支持LESS
  • 模块化
  • 支持自定义主题
  • 支持响应式设计

如何使用?

使用UIkit非常简单,下载后,请参考如下的框架代码:

    <!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" href="uikit.min.css" />
<script src="jquery.js"></script>
<script src="uikit.min.js"></script>
</head>
<body>
</body>
</html>

然后,请参考UI组件相关的文档:

UI组件包含如下几个不同的UI组件类型:

  • 缺省
  • 布局
  • 导航
  • 元素
  • 常用
  • Javascript

针对Javascript的设计,你可以不使用任何JS代码,而使用典型的data-ui-*方式来生成UI元素,如下:

<button data-uk-button>My Button</button>

当然,也可以使用jQuery API方式,如下:

$(".button").uk("button");

自定义主题

你可以方便的使用自定义工具来定义或者扩展你需要的主题,如下:

via 极客标签

来源:轻量级的前端UI开发框架 - UIkit

轻量级的前端UI开发框架 - UIkit的更多相关文章

  1. 推荐一款强大的轻量级模块化WEB前端快速开发框架--UIkit

    前言 今天给大家分享一款强大的轻量级模块化WEB前端快速开发框架--UIkit 到目前(2016-06-20)为止,UIkit在github上的Forks已达到了1350个,而Stars更是达到了69 ...

  2. 基于React 的前端UI开发框架 及与Electron 的结合 https://cxjs.io/

    1.cxjs  基于React 的前端UI开发框架    https://cxjs.io/ coreu   http://coreui.io/ 2.antd-admin                ...

  3. 颠覆式前端UI开发框架:React

    转自:http://www.infoq.com/cn/articles/subversion-front-end-ui-development-framework-react/ 基于HTML的前端界面 ...

  4. Semantic UI – 完全语义化的前端界面开发框架

    Semantic UI 是一个 UI 库,使前端开发更简单,更容易学习.Semantic UI 介绍了许多界面元素.在大多数情况下,只有你需要的元素建立一个自定义的构建可能是最好的. UI 组件分为四 ...

  5. 2015年最全的移动WEB前端UI框架

    目前,众多互联网公司APP都嵌入了大量的HTML5,移动端的开发越来越重视,HTML5的运用场景也越来越多了.在移动WEB开发的过程中,使用合适的移动WEB UI框架可以大大提升我们的开发效率.下面P ...

  6. 前端UI框架小汇总

    前言: 近期,小弟根据GitHub.前端社区.掘金等平台对当前流行的前端UI框架的进行了小小的整理和汇总(ps:前端UI框架的应用是通过GitHub star数,社区热度和使用范围等进行的粗略的汇总[ ...

  7. web前端UI框架

    分类:WEB前端 时间:2016年1月13日 目前,众多互联网公司APP都嵌入了大量的HTML5,移动端的开发越来越重视,HTML5的运用场景也越来越多了.在移动WEB开发的过程中,使用合适的移动WE ...

  8. 前端UI框架选择区别对比推荐

    UI选择务必慎重,货比三家. 弱水三千只取一瓢:弱水三千只取一瓢,源起佛经中的一则故事,警醒人们在一生中可能会遇到很多美好的东西,但只要用心好好把握住其中的一样就足够了 老牌构建于jQuery框架之上 ...

  9. 推荐几个精致的web UI框架及常用前端UI框架

    1.Aliceui Aliceui是支付宝的样式解决方案,是一套精选的基于 spm 生态圈的样式模块集合,是 Arale 的子集,也是一套模块化的样式命名和组织规范,是写 CSS 的更好方式. git ...

随机推荐

  1. bzoj 1559 AC自动机 + dp

    思路:直接在状态图上跑dp,最后枚举一下42种一下的.. 这个枚举有点恶心. #include<bits/stdc++.h> #define LL long long #define ll ...

  2. springBoot service层 事务控制

    springBoot使用事物比较简单,在Application启动类s上添加@EnableTransactionManagement注解,然后在service层的方法上添加@Transactional ...

  3. onethink 重写URL后,apache提示No input file specified

    <IfModule mod_rewrite.c> RewriteEngine on RewriteCond %{REQUEST_FILENAME} !-d RewriteCond %{RE ...

  4. 关于公众号JavaTokings侵权声明

    该公众号几乎有所有文章都是在未经原作者的同意下私自将文章转移至其公众号.其中 [消息中间件ActiveMQ使用详解](链接是:https://www.cnblogs.com/yanfei1819/p/ ...

  5. Python开发基础-Day20继承实现原理、子类调用父类的方法、封装

    继承实现原理 python中的类可以同时继承多个父类,继承的顺序有两种:深度优先和广度优先. 一般来讲,经典类在多继承的情况下会按照深度优先的方式查找,新式类会按照广度优先的方式查找 示例解析: 没有 ...

  6. 【带权并查集】poj1182 食物链

    带权并查集,或者叫做种类并查集,经典题. http://blog.csdn.net/shuangde800/article/details/7974668 这份代码感觉是坠吼的. 我的代码是暴力分类讨 ...

  7. python基础之面向过程编程,模块

    面向过程编程 面向过程的核心是过程,指的是解决问题的步骤,即先干什么再干什么,就好像设计一条流水线. 优点:复杂的问题流程化,进而简单化 缺点:可扩展性差,修改流水线的任意一个阶段,都会牵一发而动全身 ...

  8. Atom | 编辑器Atom的使用小结

    文章目录 windows环境下 Atom工具使用apm Packages 推荐阅读 常用快捷键 windows环境下 Atom工具使用apm 在 Atom 的安装路径下找到 apm ,复制路径: 将该 ...

  9. github之怎么上传本地项目

    github之怎么上传本地项目 以前都是在自己磁盘上的某个目录下,然后打开git bash,来进行把本地的一些文件推到远程github上. 之前的方法步骤: 1.在github上new一个库,然后gi ...

  10. OpenLayers2中的事件_以Popup为例

    SATURDAY, 21 MARCH 1-Preface 前几天阅读学习了OpenLayers'Cookbook中的第四章——Working with events. 从AFDS系统的开发项目进行至今 ...