UIkit3.x文档

从右到左的支持

UIkit支持从右到左的语言,并允许您改变所有设计元素的方向。

RTL版本切换UIkit设计元素的方向,包括浮动(floats)、文本对齐(text-align)、位置坐标(position coordinates)、背景的阴影方向等属性。并且所有显式命名为 *-left or *-right 的类名在RTL版本中可以保持不变。


用法

要在RTL模式下使用UIkit,请使用dist/文件夹中的 uikit.rtl.min.css文件。确保将 dir="rtl" 属性添加到您网站的 <html> 标记中。JavaScript默认情况下支持RTL,因此您可以包含常规JS文件而无需进行任何更改。

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

看一下可用的组件,然后像往常一样创建标记。 使用RTL版本时没有任何区别。


从源代码编译

如果您 从Github源设置UIkit, 这将包括您在custom/目录中创建的任何 自定义UIkit主题

yarn
yarn compile-rtl

生成的文件位于 dist/ 文件夹中,并以 *.rtl.css结尾。 JavaScript文件与默认LTR版本保持相同。