我想知道我们是否可以编写垂直文本，但不要使用任何改变字符方向的技巧的旋转。
所以，我想要一个文本，而不是">开始"，在 maydiv 中显示一个文本，如下所示：
S
TA
R
T
我可以使用"break-word：word-break"并将元素的宽度设置为 0，但文本不会居中。字符将只向左对齐
不是重复的：垂直文本方向
我不想旋转文本，我想保留字符的方向
这是我可以获得的代码示例：
.vertical-text {
font-size: 25px;
word-break: break-word;
width: 0;
display: flex;
justify-content: center;
padding: 0;
border: 1px solid rgba(0, 0, 0, 0.2);
position: absolute;
top: 50%;
left: 50%;
transform: translate3d(-50%, -50%, 0);
}
body, html {
margin: 0;
padding: 0;
height: 100%;
width: 100%
}<div class="vertical-text">START IT<div>您可以将writing-modeCSS 属性与text-orientationCSS 属性结合使用。
div {
writing-mode: vertical-lr;
text-orientation: upright;
}
引用，writing-mode属性..
[..]指定块流方向，即 堆叠哪些块级容器，以及堆叠的方向 内联级内容在块容器内流动。内容流 从上到下垂直，从右到左水平。这 下一条垂直线位于前一行的左侧。
实际上，这定义了文本行是水平布局还是垂直布局以及块的前进方向。
text-orientation属性定义行中文本字符的方向。此属性仅在垂直模式下有效。
示例：
p:first-of-type {
writing-mode: vertical-lr;
}
p:last-of-type {
writing-mode: vertical-lr;
text-orientation: upright;
}<h4>With writing mode "vertical-lr"</h4>
<p>Start</p>
<hr>
<h4>With writing mode "vertical-lr" and text-orientation "upright"</h4>
<p>Start</p>请注意text-orientation：
这是一项实验性技术，因为这项技术是 规格未稳定，请检查兼容性表 在各种浏览器中的使用。另请注意，语法和行为 实验性技术在未来版本中可能会发生变化 随着规范的更改而使用的浏览器。
根据这个：https://caniuse.com/#search=text-orientation，似乎几乎所有浏览器都支持它，除了IE/Edge。
你可以试试：
.vertical-text {
margin: 0 auto 2em;
width: 0;
word-wrap: break-word;
}
body {
font-family: Helvetica, sans-serif;
text-align: center;
}
h1 {
margin-bottom: 1.5em;
}<h1>Vertically Written Text</h1>
<h2 class="vertical-text">Vertical</h2>
<p>Tested in Chrome, Safari, Firefox, IE 8, IE 9, IE 10 and IE 11.</p>几种方法可以做到这一点。
查看本教程
更新
为我提供最好的方法：
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Vertical Text</title>
<style>
h1 span { display: block; }
</style>
</head>
<body>
<h1> START </h1>
<script>
var h1 = document.getElementsByTagName('h1')[0];
h1.innerHTML = '<span>' + h1.innerHTML.split('').join('</span><span>') + '</span>';
</script>
</body>
</html>