跳至主要内容

文档

从右到左支持

UIkit 支持从右到左的语言，并允许您切换所有设计元素的方向。

RTL 版本切换 UIkit 设计元素的方向，包括浮动、文本对齐、位置坐标、背景阴影方向等属性。但是，所有明确命名为 *-left 或 *-right 的类在 RTL 版本中保持不变。

用法

要在 RTL 模式下使用 UIkit，请使用 uikit.rtl.min.css，它包含在 dist/ 文件夹中。确保将 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，您也可以自己编译 UIkit 的 RTL 版本。这将包括您在 custom/ 目录中创建的任何 自定义 UIkit 主题。

pnpm install
pnpm compile-rtl

现在，结果文件位于 dist/ 文件夹中，以 *.rtl.css 结尾。JavaScript 文件与默认的 LTR 版本相同。