css文字排列方式

2021-08-19 16:52:37 字數 1604 閱讀 7889

1.direction: rtl/ltr;

2. writing-mode:

lr-tb

ie7+瀏覽器支援。初始值。內容從左往右(left-right),從上往下(top-rl-tbie7+瀏覽器支援。內容從右往左(right-left,從上往下(top-tb-rlie7+瀏覽器支援。內容從上往下(top-bottom),從右往左(right-left)垂直流動, 下乙個垂直行定位於前乙個垂直行的左邊,全形符號直立定位,非全形符號(也可以被稱作窄拉丁文或者窄假名符號)順時針方向旋轉90°。這種布局多見於東亞排版。bt-rlie7+瀏覽器支援。內容從下往上(bottom-top),從右往左(right-left)垂直流動, 下乙個垂直行定位於前乙個垂直行的左邊,全形符號直立定位,非全形符號(也可以被稱作窄拉丁文或者窄假名符號)順時針方向旋轉90°。此布局多見於在東亞垂直排版從右往左的文字塊上。tb-lrie8+瀏覽器支援。 內容從上往下(top-bottom),從左往右(left-right)垂直流動。下乙個垂直行在前乙個的右邊。bt-lrie8+瀏覽器支援。 內容從下往上(bottom-top),從左往右(left-right)垂直流動。lr-btie8+瀏覽器支援。 內容從下往上(bottom-top),從左往右(left-right)水平流動。下乙個水平行在前一行的上面。rl-btie8+瀏覽器支援。內容從下往上(bottom-top), 從右往左(right-left)水平流動。lrie9+瀏覽器支援。在svg和html元素上使用。等同於lr-tb.rlie9+瀏覽器支援。在svg和html元素上使用。等同於rl-tb.tbie9+瀏覽器支援。在svg和html元素上使用。等同於tb-rl.

各個屬性值的表現如下(form微軟官網)

筆記 css實現文字橫向排列 豎向排列

writing mode 書寫模式 屬性值效果 horizontal tb 橫向排列 vertical rl 豎向排列,從右到左 vertical lr 豎向排列,從左到右 舉例如下 html textbox horizontal tb 橫向排列 h1 vertical rl 縱向排列,從右到左 h...

CSS 文字對齊方式

方法1 單行塊級元素水平居中只用新增text align即可,如p標籤,垂直居中vertical align只適用於行內元素與單元格,所以設定行高與塊高度相同即可 text align center 方法2 普通的文字居中只要設定text align即可,但是這個設定了p標籤的寬度,則是在該寬度內進...

CSS3實現文字垂直排列 writing mode

最近的乙個專案中要使文字垂直排列,也就是運用了css的writing mode屬性。writing mode最初時ie中支援的乙個屬性,後來在css3中增添了這一新的屬性,所以在ie中和其他瀏覽器中的語法會有區別。writing mode horizontal tb 預設 水平方向,從上到下 wri...