UIkit3.x文档

介绍

熟悉UIkit的基本设置和概述。

首先,您需要下载UIkit。有关其他软件包和CDN的链接,安装指南 了解更多信息。

下载UIKIT


包含的内容

Zip文件内包含已经编译好的CSS和JavaScript文件,这是您入门所需的一切。以后,您可能想要自己 安装和编译UIkit 或者 创建你自己的Uikit主题.

文件夹 描述
/css 包含 UIkit 的 CSS 文件及其压缩版本。
/js 包含UIkit JavaScript和图标库用到的JavaScript

HTML 示例

将经过编译和压缩的CSS和JavaScript添加到您HTML5文档的 <head> 标记中,包括UIkit图标库。像如下所示这样就可以了。

<!DOCTYPE html>
	<html>
	    <head>
	        <title>Title</title>
	        <meta charset="utf-8">
	        <meta name="viewport" content="width=device-width, initial-scale=1">
	        <link rel="stylesheet" href="css/uikit.min.css" />
	        <script src="js/uikit.min.js"></script>
	        <script src="js/uikit-icons.min.js"></script>
	    </head>
	    <body>
	    </body>
	</html>

把 UIkit 添加到文档中后,了解一下所有可用的组件,并在 <body> 元素内部写入你需要的 HTML 标签吧。


代码编辑器中 UIkit 自动完成

如果你有一款可靠的代码编辑器,, 例如 Sublime Text or Atom. 就可以很好地使用 UIkit,我们建议您为自己喜欢的IDE或代码编辑器安装一个自动完成插件。这将节省大量时间,因为您不必再去查找和手动输入所有的Uikit的class和HTML标签。


浏览器支持情况

下方列出的是经过我们测试过的支持UIkit的浏览器版本。“最新”意味着它在该浏览器的所有最新版本上都可以正常工作。随着许多浏览器采用滚动发布策略,将浏览器支持固定到特定版本在现在来说变得有些麻烦。简单的说来就是:UIkit几乎可以在当前的任何浏览器上正常运行。

Chrome

最新

Firefox

最新

Edge

最新

Safari

最新

Opera

最新