Question

查看

   <div class="panel-body">
                <div class="form-group" style="direction: rtl">
                    <div class="col-md-2">
                        <label class="control-label">@Resources.VMSResource.VisitorName </label>
                    </div>
                    <div class="col-md-3">
                        @Html.EditorFor(model => model.VisitorName, new { htmlAttributes = new { @class = "form-control input-sm " } })
                        @Html.ValidationMessageFor(model => model.VisitorName, "", new { @class = "text-danger" })
                    </div>
                    <div class="col-md-2">
                        <label class="control-label">@Resources.VMSResource.EmployeeID </label>
                    </div>
                    <div class="col-md-3">
                        @Html.EditorFor(model => model.EmployeeID, new { htmlAttributes = new { @class = "form-control input-sm" } })
                        @Html.ValidationMessageFor(model => model.EmployeeID, "", new { @class = "text-danger" })
                    </div>
                </div>
</div>

我正在MVC中实施全球化。

对于阿拉伯语，我希望控件方向为RTL。我尝试将方向设置为DIV的RTL：

 <div class="panel-body" style="direction:RTL">

但它只是将文本框中的方向设置为RTL。相反，我希望控件（如Label，textbox）移动RTL。

Answer 1

使用从左到右语言设计的CSS与从右到左的语言设计并不像看起来那么容易。只是将父元素的方向更改为RTL并不意味着所有子元素都正确地成为RTL。还有更多工作要做。例如，您应该将margin-right更改为margin-right或更改padding的值等。

通过这种方式，有几个基于不同方法的教程;所有这些都有利有弊。首先，我建议您3 Different Ways to RTL your CSS和RTLCSS

如果你使用的是Bootstrap，我认为最好的选择是https://github.com/morteza/bootstrap-rtl。

Answer 2

<html dir="@(System.Globalization.CultureInfo.DefaultThreadCurrentCulture.TextInfo.IsRightToLeft? "rtl" : "ltr")">

取自aspnet核心的代码示例

详细信息，您可以通过以下链接访问。

https://www.w3schools.com/tags/att_global_dir.asp

Answer 3

在Html中使用

<!DOCTYPE html>
<html dir="rtl" lang="ar">
<head>
<meta charset="utf-8">
...

除了在我的site.css文件中使用的标签外，这几乎所有内容都适合我。

.form-horizontal .control-label {
    float: right;
}

在全球化asp.net MVC中改变方向

3 个答案: