如何在div+css中字体方向为竖排？

发布网友 发布时间：2022-02-23 08:15

我来回答

共5个回答

热心网友 时间：2022-02-23 09:45

1、首先打开hbuilder软件，新建一个html文件，里面写入一个div并设置class属性，在上方耳朵style标签中设置body标签的背景色，方便后面观察效果。

2、然后设置class的样式，这里给div一个比较小的宽度并设置行高和边框，然后设置word-warp属性，该属性表示允许长单词换行到下一行，再设置一下letter-spacing调整每个字之间的距离就可以了。

3、最后打开浏览器就可以看到竖排的文字了。

热心网友 时间：2022-02-23 11:03

1、第一种方法：将需要竖排显示的字符放在span中，在CSS中设置span的display属性为block，不过不推荐使用这种方法，因为有些麻烦，代码如下：

2、第二种方法A：同样使用CSS，在需要竖向显示的地方，强制定义显示区域的宽度，这样字符会自动竖向排列：请看具体代码：

3、第二种方法B：同样是使用CSS，推荐使用这种方法，觉得这个方法兼容性也好，而且代码简洁，字符也容易控制。

热心网友 时间：2022-02-23 12:37

这种效果用

writing-mode:vertical-lr;

另外一种的竖排看0404的

热心网友 时间：2022-02-23 14:29

HTML改变文字方向

热心网友 时间：2022-02-23 16:37

？你是说最后显示？ 正常不应该啊 你看下你选择的字体 前面有“@”就是竖着排列追问我查到拉，是字体竖排方向：writing-mode：lr-tb；tb-rl 这个。

追答哈 我糊涂了 脑子里正想着PS呢当时……
对的就是这个 DIV 默认都是lr-tb 从左向右由上往下 的~
解决了就好哈~