css文本&布局属性

1.writing-mode(协作模式):块内容(段落)在页面的流程方式

   horizontal-tb(默认):水平内容,从上到下
   vertical-lr:垂直内容,从左到右
   vertical-rl:垂直内容,从右到左

2.direction(方向):内联内容(字符)如何在屏幕上流动

   ltr(默认):从左到右
   rtl: 右到左

3.flex(弹性盒子)- 物理属性

   不区分上下左右,依赖主轴和交叉轴方向

 4.grid(网格布局)- 物理属性

   不区分上下左右,它按两个非分层轴按行和列布置项目

 5.逻辑属性&物理属性

   逻辑熟悉:对于需要支持RTL 和/或垂直语言脚本的开发很有用

.add-dimensions {
   /* 物理属性| English */
   width: 600px;
   height: 200px;
   padding:20px;
   /* 逻辑属性: */
   inline-size: 600px;/*inline-size:内联尺寸(因为字符垂直流动)*/
   block-size: 200px;/*block-size:块尺寸(因为段落水平流动)*/
   padding-block:20px;/*用于定义元素的逻辑块开始和结尾填充*/
}

 

posted @ 2023-07-05 10:47  卷叶小树  阅读(9)  评论(0编辑  收藏  举报