Question

我尝试创建类似图像的垂直菜单显示，但是您也可以在设计字体中以垂直位置看到垂直显示菜单，那么该怎么办呢？
1. 我想使用ul li创建垂直菜单，并使用垂直单个字体
2. 我尝试旋转li标签，但未设置
3. 我也想使此菜单成为响应式菜单

Answer 1

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
<style>

</style>
</head>
<body>


<ul style="list-style-type:none;">
    <li><span style="writing-mode: vertical-rl;">abcd</span></li>
    <li><span style="writing-mode: vertical-rl;">abcd</span></li>
    <li><span style="writing-mode: vertical-rl;">abcd</span></li>
    <li><span style="writing-mode: vertical-rl;">abcd</span></li>
</ul>


</body>
</html>

尝试此操作并响应媒体查询

还要检查https://developer.mozilla.org/en-US/docs/Web/CSS/text-orientation

如何用垂直字体创建垂直菜单？

1 个答案: