使用html+JQ+css5 完成代码横版文字转换成竖版 从左到右

HTML代码：

<div class="vertical-text">
  <span>你好</span>
  <span>世界</span>
</div>

CSS代码：

.vertical-text {
  display: flex;
  flex-direction: column;
}

.vertical-text span {
  writing-mode: vertical-lr;
  transform: rotate(-180deg);
}

JQ代码：

$(document).ready(function() {
  var text = $('.vertical-text span');
  var height = text.height();
  text.css('line-height', height + 'px');
});

说明：

• 使用flex布局，使文字竖直排列。
• 使用writing-mode属性设置文字排列方式为从左到右排列。
• 使用transform属性将文字翻转180度。
• 使用JQ代码将每个文字的行高设置为文字高度，保证文字在竖直方向上居中对齐。