如何更改 material-ui 中的 TextField 悬停边框效果？

Question

所以在波斯语中方向是 rtl .

我想知道如何将此输入更改为我的项目语言？

请看这张图片

这就是我想做的，但我不知道如何更改悬停时的边界线。 我可以使用 position: relative or absolute 更改标签文本并移动它，但是当我们单击输入进行键入时，我不知道如何处理该边界线？

我该如何移动它？我将不胜感激。

materialui代码

import * as React from "react";
import TextField from "@mui/material/TextField";

      <div style={{ margin: "10rem 5rem" }}>
        <TextField
          id="outlined-basic"
          label="متن"
          variant="outlined"
        />
      </div>

Answer 1

您需要将内部字段集 text-align 更改为“右”而不是“左”，并更改标签的变换 X 属性，您也可以从 left:0 到 right:0，将标签的位置从左移到右，有多种解决方案，只需查看文档以了解如何更改内部元素的属性。