ui kit html,开始使用

开始使用

熟悉 UIkit 的基本组织结构。

注意 文档中的示例代码不具备可操作性,请随时右键查看源代码,以参考实例真实代码。

UIkit 兼容 IE9 以上现代浏览器。在 IE8 及其以下版本中,所有JavaScript 都会失效。

首先,你需要下载 UIkit。在 GitHub 上,你可以找到整个项目的所有源文件。

文件结构

在你下载的 ZIP 压缩包中,你可以找到准备在你的项目中使用的所有的CSS、JavaScript和字体文件。UIKit 的核心框架uikit.css 或 uikit.min.css几乎没有任何样式,这样做是为了保持它的苗条。因此我们提供两个额外的风格样式,一个渐变样式和一个扁平化样式。每个风格样式提供单独的CSS文件以及压缩后的版本。

文件夹描述/css包含 UIkit 所有的CSS文件和压缩后的版本。

/fonts包含 UIKit 中使用的字体文件。

/js包含 UIkit 所有的JavaScript文件和压缩后的版本。/css

uikit.css

uikit.min.css

uikit.gradient.css

uikit.gradient.min.css

uikit.almost-flat.css

uikit.almost-flat.min.css

/components

/fonts

fontawesome-webfont.eot

fontawesome-webfont.ttf

fontawesome-webfont.woff

FontAwesome.otf

/js

uikit.js

uikit.min.js

/components

/core

HTML页面代码

首先,确保你有一个可靠的代码编辑器,比如 Sublime Text 2。你需要在你的HTML5的文档头部添加编译后的UIKit CSS和JavaScript文件,最好是压缩后的版本。别忘了添加 jQuery。就是这样!

Example

如果你已经完成了在网页中添加 UIkit,那就看一下 UIkit 组件 并从中获取相关介绍吧。

UIkit on BootCDN

所有版本的 UIkit 都被托管在 BootCDN 上,就是 Bootstrap 中文网那个 BootCDN 。在这里可以找到 UIkit : www.bootcdn.cn 。

Example

IDE 上的 UIkit 自动完成

为了更高效地工作,我们建议你为你喜欢的 IDE 或 代码编辑器安装一个自动完成插件。这样可以节省很多时间,因为你不必查找再输入所有UIkit的class 和 HTML 标记。

Sublime 上的自动完成 - 通过 Sublime 的 Package Control 来安装。

PHPstorm 上的自动完成 - 通过 PHPsorm 的插件设置进行安装。

Atom 上的自动完成 - 在 Atom 的 package manager 里寻找它。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值