CSS中带垂直文本的垂直制表符

Question

我有一系列.jpeg菜单标签，其中包含垂直文字，并且垂直定向（高度>宽度）。尝试创建垂直选项卡，使它们从屏幕的顶部到底部串联，但在阅读了一些文档后，我仍然不确定从哪里开始。有小费吗？对于非常模糊的问题感到抱歉，但大多数搜索结果都假设您需要一个带水平文本的垂直菜单。

Answer 1

您可以使用word-wrap: break-word;结合较窄的width值来强制您的文字换行每一个字母：http://jsbin.com/ominus/1/edit

旋转看起来会更好，但这是另一种选择！

Answer 2

如果浏览器兼容性不是优先事项，您可以尝试使用CSS3：

.rotated-text {
    -webkit-transform: rotate(-90deg); 
    -moz-transform: rotate(-90deg); 
    -o-transform: rotate(-90deg);   
    transform: rotate(-90deg);  
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); /* Should work on IE9+ */
}

工作示例： http://jsfiddle.net/C3qrT/

然后您必须根据需要调整文本。