css中我们需要同时调整direction属性和unicode-bidi属性
.cssClassName { direction:rtl; unicode-bidi:bidi-override; }
CSS direction 属性
定义和用法
direction 属性规定文本的方向 / 书写方向。
该属性指定了块的基本书写方向,以及针对 Unicode 双向算法的嵌入和覆盖方向。不支持双向文本的用户代理可以忽略这个属性。
默认值: | ltr |
---|---|
继承性: | yes |
版本: | CSS2 |
JavaScript 语法: | object.style.direction="rtl" |
可能的值
值 | 描述 |
---|---|
ltr | 默认。文本方向从左到右。 |
rtl | 文本方向从右到左。 |
inherit | 规定应该从父元素继承 direction 属性的值。 |
CSS unicode-bidi 属性
定义
unicode-bidi 属性设置文本的方向。
继承性:Yes
说明
尽管 CSS 试图处理书写方向,但 Unicode 有一种更健壮的方式来处理方向性。利用属性 unicode-bidi,CSS 创作人员可以充分利用 Unicode 的某些功能。
可能的值
在这里,我们将简要引用 CSS2.1 规范中关于这些值的描述,这些描述很好地说明了各个值的实现。
normal
元素不会对双向算法打开附加的一层嵌套。对于行内元素,顺序的隐式重排会跨元素边界进行。
embed
如果是一个行内元素,这个值对于双向算法会打开附件的一层嵌套。这个嵌套层的方向由 direction 属性指定。会在元素内部隐式地完成顺序重排。这对应于在元素开始处增加一个 LRE(对于 direction:ltr :U+202A)或 RLE(对于 direction:rtl :U+202B),并在元素的最后增加一个 PDF(U+202C)。
bidi-override
这会为行内元素创建一个覆盖。对于块级元素,将为不在另一块中的行内后代创建一个覆盖。这说明,顺序重排在元素内部严格按照 direction 属性进行;忽略了双向算法的隐式部分。这对应于在元素开始处增加一个 LRO(对于 direction:ltr :U+202D)或 RLO(对于 direction:rtl :U+202E),并在元素最后增加一个 PDF(U+202C)。
vant 组件中调整右到左方向
van-field中使用
<van-field v-model="value" label="文本" placeholder="请输入用户名" input-align="right" label-align="right"/>