html - 如何在不改变主体的情况下改变 div 元素的方向

Question

您好，我试图改变 div 元素的方向（从 ltr 到 rtl），以便用阿拉伯语完美显示，但我不知道如何，所以这是代码，请帮忙

<div>
    <section id="func1">
      <label for="function"> :دستور الدالة 1 </label>
      <input id="function" type="text" value="x*x" onchange="plot();">
      <p></p>
      <label for="derivative"> :مشتق الدالة 1 </label>
      <input type=text id="der" value="2*x" onchange="plot();">
      <p></p>
      <p></p>
      <label for="color">:لون المنحنى </label>  <input type=color id="color" onchange="plot();">
      <p></p>
    </section>
</div>

这也是一张描述更多的图片：

输入字段应显示在左侧，文本显示在右侧

标签： htmlcss

Answer 1

Simply put a dir attribute with the value of rtl, like this: dir="rtl"

Check the snippet:

<div dir="rtl">
    <section id="func1">
      <label for="function"> :دستور الدالة 1 </label>
      <input id="function" type="text" value="x*x" onchange="plot();">
      <p></p>
      <label for="derivative"> :مشتق الدالة 1 </label>
      <input type=text id="der" value="2*x" onchange="plot();">
      <p></p>
      <p></p>
      <label for="color">:لون المنحنى </label>  <input type=color id="color" onchange="plot();">
      <p></p>
    </section>
</div>