如何垂直显示标签文字 [英] how to display label text vertically
问题描述
大家好，
我有一个label(label1)及其Text ="Joy".我已将Css代码用于不同的浏览器，如下所示.
< script type ="text/css">
Writing-mode:tb-rl;//对于IE并显示类似J的文本，但我需要像y
o o
y J
-webkit-transform:旋转(-90deg); //为了使Safari浏览器工作正常.
-moz-transform:旋转(-90deg);//使Firefox运行正常.
</script>
我正面临IE的问题，因此请通过示例提出一些解决方案.
Hi All,
I''ve a label(label1)and its Text="Joy".I have used Css code for different browser as shown below.
<script type="text/css">
writing-mode:tb-rl;//for IE and displaying the text like J but i need it like y
o o
y J
-webkit-transform: rotate(-90deg); //for safari working fine.
-moz-transform: rotate(-90deg);//for firfox working fine.
</script>
i''m facing the problem with the IE.So please suggest some solutions with examples.
推荐答案
<html>
<head>
<title>Text Vertical</title>
<style type="text/css">
.txtVertical
{
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); /* IE6,IE7 */
ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=3)"; /* IE8 */
-moz-transform: rotate(-90deg); /* FF3.5+ */
-o-transform: rotate(-90deg); /* Opera 10.5 */
-webkit-transform: rotate(-90deg); /* Safari 3.1+, Chrome */
position: absolute;
}
</style>
</head>
<body>
<div class="txtVertical">Test message</div>
</body>
</html>
免费附件
使用CSS上下颠倒文字 [
Free attachment
Making Text Upside down using CSS[^]
Let me know & give me feedback.
在每个字符之间添加
标签...
或
Add
tag between each character...
OR
.vertical
{
writing-mode: tb-rl;
filter: flipH flipV;
}
Here is the complete code.
<html>
<head>
<title>Vertical text</title>
<style>
.vertical
{
writing-mode: tb-rl;
filter: flipH flipV;
}
</style>
</head>
<body>
<div class="vertical">Test-1</div>
</body>
</html>
In the case of ASP.Net, you can give it like this.
In the document properties, you define the external css file. Then modify the label tag like this.
<asp:label id="abc" class="vertical" ........</asp:label>
这篇关于如何垂直显示标签文字的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
