# 竖排 > 适合谁看：做古籍、诗词、书法风格或传统风格的版面，需要竖排中文的设计师和开发者。 ## 竖排和横排的区别 clreq 列出的主要差异： | 项目 | 竖排 | 横排 | |---|---|---| | 文字方向 | 从上到下 | 从左到右 | | 行的方向 | 从右到左 | 从上到下 | | 翻页 | 书从左往右翻（右侧装订） | 书从右往左翻（左侧装订） | | 大陆标点位置 | 字框右上角 | 字框左下角 | | 大陆引号 | 直角引号「」 | 弯引号 “ ” | | 图表说明 | 放在图表左右 | 放在图表上下 | ## 标点要换字形竖排时，括号、引号、书名号、破折号、省略号要转 90°；大陆式的逗号、句号要从左下角挪到右上角。这些通常由字体里的竖排字形（OpenType `vert`、`vrt2` 功能）自动完成，所以**竖排一定要用支持竖排的字体**。字体不支持时，标点会躺倒或位置错误。 ## 西文和数字怎么摆 clreq 列出三种： 1. **逐字直立**：单个字母、首字母缩写（如 GDP），用和汉字等宽的字形； 2. **整体顺时针转 90°**：一般的英文单词、句子、四位以上的数字； 3. **纵中横**：两三位数字横着排在一个字的位置里，如「28」。竖排时也常直接用汉字数字（如「二〇二六年」）。 ## 网页上的竖排 ```css .vertical { writing-mode: vertical-rl; /* 从上到下，行从右到左 */ text-orientation: mixed; /* 中文直立，西文旋转 */ } .vertical .tcy { text-combine-upright: all; /* 纵中横 */ } ``` 据 MDN 兼容性数据：`writing-mode` 在 Chrome 48、Firefox 41、Safari 10.1 起无前缀支持；`text-combine-upright` 在 Chrome 48、Firefox 48、Safari 15.4 起支持。注意： - 竖排时 `width` 和 `height` 的作用对调，用 `inline-size`、`block-size` 这类逻辑属性更省事； - 竖排要加 `lang="zh-Hans"` 或相应的语言标记，浏览器和字体才能选对标点字形。