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版本保持相同。