uni-app：文字竖直排列，并且在父级view中水平竖直对齐

一、效果

二、代码

<template><view class="parent"><text class="child">这是竖直排列的文字</text></view>
</template>
<script>export default {data() {return {}},methods: {},};
</script>
<style>.parent {display: flex;align-items: center; /* 竖直居中 */justify-content: center; /* 水平居中 */height: 500px; /* 父级高度设为100%，或指定一个固定高度 */border:1px solid black;}.child {writing-mode: vertical-rl; /* 文字竖直排列，从右向左 */text-orientation: upright; /* 文字保持正常方向 */border:1px solid red;}
</style>