CSS 基础学习-083 css改变文本的方向

由 hrs, 9 十月, 2021

direction 属性规定文本的方向 / 书写方向。

值	描述
ltr	默认。文本方向从左到右。
rtl	文本方向从右到左。
inherit	规定应该从父元素继承 direction 属性的值。

unicode-bidi 属性与 direction 属性一起使用，设置或返回是否应重写文本以支持同一文档中的多种语言

值	描述
normal	默认值。元素不会打开额外的嵌入级别。
embed	对于行内元素，此值将打开额外的嵌入级别。
bidi-override	对于行内元素，该值会创建一个覆盖；对于块容器元素，该值将为不在另一个块容器元素内的行内级别的后代创建一个覆盖。
isolate	该元素与其同胞隔离。
isolate-override
plaintext
initial	将此属性设置为其默认值。
inherit	从其父元素继承此属性。

实例代码：

<!doctype html>
<html>
  <head>
    <meta charset="utf-8">
    <style>
      .p2{
        direction:rtl;/*设置文本的方向从右到左*/
        unicode-bidi:bidi-override;/*对文本进行重写覆盖*/ 
      }   
    </style>
  </head>
  <body>
    <h1>改变文本方向</h1>
    <p class="p1">这是一段正常的文本</p>
    <p class="p2">这是一段反方向的文本</p>
  </body>
</html>
~

运行效果：

CSS 基础学习-083 css改变文本的方向

标签

评论

相关文章