Question

我尝试将semantic-ui菜单组件从右向左更改，但语义ui使用flex菜单和任何其他组件，我尝试此菜单右侧

<div class="ui secondary menu">
  <a class="active item">
    Home
  </a>
  <a class="item">
    Messages
  </a>
  <a class="item">
    Friends
  </a>
</div>

当插入＆＃34;左＆＃34;第一个班级＆＃34; a＆＃34;标签菜单向右浮动，但第一个标签仍位于

的左侧

<div class="ui secondary menu">
  <a class="active item left">
    Home
  </a>
  <a class="item">
    Messages
  </a>
  <a class="item">
    Friends
  </a>
</div>

Answer 1

创建自定义类.rtl并使用flex-direction到row-reverse，代表从右到左的菜单。

＆＃13;

.rtl {
  flex-direction: row-reverse;
}

＆＃13;

<link href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.0.1/semantic.min.css" rel="stylesheet" />
<div class="ui secondary menu rtl">
  <a class="active item">
    Home
  </a>
  <a class="item">
    Messages
  </a>
  <a class="item">
    Friends
  </a>
</div>

＆＃13;

Answer 2

最好的选择是在HTML中使用index.js属性。

＆＃13;

dir

＆＃13;

如何将语义菜单更改为RTL

2 个答案: