blocks|key|1480185|text|替代解决方案？|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1480186|与其旋转文本，不如把它写成“从上到下”。|1480187|如下所示：|1480188|S++
O++
M++
E++

T++
E++
X++
T++|code-block|syntax|javascript|1480189|我认为这会容易得多-你可以选择一个文本字符串分开，并在每个字符后插入一个换行符。|1480190|这可以通过浏览器中的JavaScript完成，如下所示：|1480191|"SOME+TEXT".split("").join("\n")|1480192|..。或者你可以在服务器端做，这样它就不会依赖于客户端的JS功能。(我想这就是您所说的“便携？”)|1480193|此外，用户也不必侧着头来阅读它。:)|1480194|更新|1480195|This+thread是关于用jQuery来做这件事的。|offset|length|1480196|entityMap|0|LINK|mutability|MUTABLE|url|https://stackoverflow.com/questions/278940/vertical-text-with-jquery^0|0|0|0|0|0|0|0|0|0|0|0|B|0|0^^$0|@$1|2|3|4|5|6|7|18|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|19|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|1A|8|@]|9|@]|A|$]]|$1|F|3|G|5|H|7|1B|8|@]|9|@]|A|$I|J]]|$1|K|3|L|5|6|7|1C|8|@]|9|@]|A|$]]|$1|M|3|N|5|6|7|1D|8|@]|9|@]|A|$]]|$1|O|3|P|5|H|7|1E|8|@]|9|@]|A|$I|J]]|$1|Q|3|R|5|6|7|1F|8|@]|9|@]|A|$]]|$1|S|3|T|5|6|7|1G|8|@]|9|@]|A|$]]|$1|U|3|V|5|6|7|1H|8|@]|9|@]|A|$]]|$1|W|3|X|5|6|7|1I|8|@]|9|@$Y|1J|Z|1K|1|1L]]|A|$]]|$1|10|3|-4|5|6|7|1M|8|@]|9|@]|A|$]]]|11|$12|$5|13|14|15|A|$16|17]]]]

<h2>Alternate Solution?</h2>
<p>Instead of rotating the text, would it work to have it written &quot;top to bottom?&quot;</p>
<p>Like this:</p>
<pre><code>S  
O  
M  
E  

T  
E  
X  
T  
</code></pre>
<p>I think that would be a lot easier - you can pick a string of text apart and insert a line break after each character.</p>
<p>This could be done via JavaScript in the browser like this:</p>
<pre><code>&quot;SOME TEXT&quot;.split(&quot;&quot;).join(&quot;\n&quot;)
</code></pre>
<p>... or you could do it server-side, so it wouldn't depend on the client's JS capabilities. (I assume that's what you mean by &quot;portable?&quot;)</p>
<p>Also the user doesn't have to turn his/her head sideways to read it. :)</p>
<h3>Update</h3>
<p><a href="https://stackoverflow.com/questions/278940/vertical-text-with-jquery">This thread</a> is about doing this with jQuery.</p>


blocks|key|1695428|text|IE+filters加上CSS转换(Safari和Firefox)。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|1695429|IE的支持是最老的，Safari至少有一些？在3.1.2中支持，而Firefox直到3.1才会支持。|1695430|或者，我建议混合使用Canvas/VML或SVG/VML。(Canvas有更广泛的支持。)|1695431|entityMap|0|LINK|mutability|MUTABLE|url|http://ajaxian.com/archives/transformie-implement-webkit-css-transforms-in-ie|1|http://webkit.org/blog/130/css-transforms/|2|https://developer.mozilla.org/En/CSS/CSS_transform_functions^0|0|A|0|I|6|1|P|7|2|0|0|0^^$0|@$1|2|3|4|5|6|7|T|8|@]|9|@$A|U|B|V|1|W]|$A|X|B|Y|1|Z]|$A|10|B|11|1|12]]|C|$]]|$1|D|3|E|5|6|7|13|8|@]|9|@]|C|$]]|$1|F|3|G|5|6|7|14|8|@]|9|@]|C|$]]|$1|H|3|-4|5|6|7|15|8|@]|9|@]|C|$]]]|I|$J|$5|K|L|M|C|$N|O]]|P|$5|K|L|M|C|$N|Q]]|R|$5|K|L|M|C|$N|S]]]]

<p><a href="http://ajaxian.com/archives/transformie-implement-webkit-css-transforms-in-ie" rel="nofollow noreferrer">IE filters</a>
plus
CSS transforms (<a href="http://webkit.org/blog/130/css-transforms/" rel="nofollow noreferrer">Safari</a> and <a href="https://developer.mozilla.org/En/CSS/CSS_transform_functions" rel="nofollow noreferrer">Firefox</a>).</p>

<p>IE's support is the oldest, Safari has [at least some?] support in 3.1.2, and Firefox won't have support until 3.1.</p>

<p>Alternatively, I would recommend a mix of Canvas/VML or SVG/VML. (Canvas has wider support.)</p>


blocks|key|1695463|text|​|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1695464|.box_rotate+{
+++++-moz-transform:+rotate(7.5deg);++/*+FF3.5%2B+*/
+++++++-o-transform:+rotate(7.5deg);++/*+Opera+10.5+*/
++-webkit-transform:+rotate(7.5deg);++/*+Saf3.1%2B,+Chrome+*/
+++++++++++++filter:+progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083);++/*+IE6,IE7+*/
+++++++++-ms-filter:+"progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083)";+/*+IE8+*/
++++}|code-block|syntax|javascript|1695465|<div>Lorem+ipsum+dolor+sit+amet,+consectetur+adipiscing+elit.+Phasellus+vitae+porta+lectus.+Suspendisse+dolor+mauris,+scelerisque+ut+diam+vitae,+dictum+ultricies+est.+Cras+sit+amet+erat+porttitor+arcu+lacinia+ultricies.+Morbi+sodales,+nisl+vitae+imperdiet+consequat,+purus+nunc+maximus+nulla,+et+pharetra+dolor+ex+non+dolor.</div>
<div+class="box_rotate">Lorem+ipsum+dolor+sit+amet,+consectetur+adipiscing+elit.+Phasellus+vitae+porta+lectus.+Suspendisse+dolor+mauris,+scelerisque+ut+diam+vitae,+dictum+ultricies+est.+Cras+sit+amet+erat+porttitor+arcu+lacinia+ultricies.+Morbi+sodales,+nisl+vitae+imperdiet+consequat,+purus+nunc+maximus+nulla,+et+pharetra+dolor+ex+non+dolor.</div>
<div>Lorem+ipsum+dolor+sit+amet,+consectetur+adipiscing+elit.+Phasellus+vitae+porta+lectus.+Suspendisse+dolor+mauris,+scelerisque+ut+diam+vitae,+dictum+ultricies+est.+Cras+sit+amet+erat+porttitor+arcu+lacinia+ultricies.+Morbi+sodales,+nisl+vitae+imperdiet+consequat,+purus+nunc+maximus+nulla,+et+pharetra+dolor+ex+non+dolor.</div>|1695466|1695467|摘自http://css3please.com/|offset|length|1695468|截至2017年，上述网站简化了规则集，删除了传统的Internet+Explorer筛选器，更多地依赖于现在的标准transform+property|style|CODE|1695469|1695470|.box_rotate+{
++-webkit-transform:+rotate(7.5deg);++/*+Chrome,+Opera+15%2B,+Safari+3.1%2B+*/
++++++-ms-transform:+rotate(7.5deg);++/*+IE+9+*/
++++++++++transform:+rotate(7.5deg);++/*+Firefox+16%2B,+IE+10%2B,+Opera+*/
}|1695471|<div>Lorem+ipsum+dolor+sit+amet,+consectetur+adipiscing+elit.+Phasellus+vitae+porta+lectus.+Suspendisse+dolor+mauris,+scelerisque+ut+diam+vitae,+dictum+ultricies+est.+Cras+sit+amet+erat+porttitor+arcu+lacinia+ultricies.+Morbi+sodales,+nisl+vitae+imperdiet+consequat,+purus+nunc+maximus+nulla,+et+pharetra+dolor+ex+non+dolor.</div>
<div+class="box_rotate">Lorem+ipsum+dolor+sit+amet,+consectetur+adipiscing+elit.+Phasellus+vitae+porta+lectus.+Suspendisse+dolor+mauris,+scelerisque+ut+diam+vitae,+dictum+ultricies+est.+Cras+sit+amet+erat+porttitor+arcu+lacinia+ultricies.+Morbi+sodales,+nisl+vitae+imperdiet+consequat,+purus+nunc+maximus+nulla,+et+pharetra+dolor+ex+non+dolor.</div>
<div>Lorem+ipsum+dolor+sit+amet,+consectetur+adipiscing+elit.+Phasellus+vitae+porta+lectus.+Suspendisse+dolor+mauris,+scelerisque+ut+diam+vitae,+dictum+ultricies+est.+Cras+sit+amet+erat+porttitor+arcu+lacinia+ultricies.+Morbi+sodales,+nisl+vitae+imperdiet+consequat,+purus+nunc+maximus+nulla,+et+pharetra+dolor+ex+non+dolor.</div>|1695472|1695473|entityMap|0|LINK|mutability|MUTABLE|url|http://css3please.com/|1|https://developer.mozilla.org/en-US/docs/Web/CSS/transform^0|0|0|0|0|2|M|0|0|1L|9|1L|I|1|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|17|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|18|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|D|7|19|8|@]|9|@]|A|$E|F]]|$1|I|3|4|5|6|7|1A|8|@]|9|@]|A|$]]|$1|J|3|K|5|6|7|1B|8|@]|9|@$L|1C|M|1D|1|1E]]|A|$]]|$1|N|3|O|5|6|7|1F|8|@$L|1G|M|1H|P|Q]]|9|@$L|1I|M|1J|1|1K]]|A|$]]|$1|R|3|4|5|6|7|1L|8|@]|9|@]|A|$]]|$1|S|3|T|5|D|7|1M|8|@]|9|@]|A|$E|F]]|$1|U|3|V|5|D|7|1N|8|@]|9|@]|A|$E|F]]|$1|W|3|4|5|6|7|1O|8|@]|9|@]|A|$]]|$1|X|3|-4|5|6|7|1P|8|@]|9|@]|A|$]]]|Y|$Z|$5|10|11|12|A|$13|14]]|15|$5|10|11|12|A|$13|16]]]]

<p><div class="snippet" data-lang="js" data-hide="false" data-console="false" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-css lang-css prettyprint-override"><code>.box_rotate {
     -moz-transform: rotate(7.5deg);  /* FF3.5+ */
       -o-transform: rotate(7.5deg);  /* Opera 10.5 */
  -webkit-transform: rotate(7.5deg);  /* Saf3.1+, Chrome */
             filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083);  /* IE6,IE7 */
         -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083)"; /* IE8 */
    }</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus vitae porta lectus. Suspendisse dolor mauris, scelerisque ut diam vitae, dictum ultricies est. Cras sit amet erat porttitor arcu lacinia ultricies. Morbi sodales, nisl vitae imperdiet consequat, purus nunc maximus nulla, et pharetra dolor ex non dolor.&lt;/div&gt;
&lt;div class="box_rotate"&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus vitae porta lectus. Suspendisse dolor mauris, scelerisque ut diam vitae, dictum ultricies est. Cras sit amet erat porttitor arcu lacinia ultricies. Morbi sodales, nisl vitae imperdiet consequat, purus nunc maximus nulla, et pharetra dolor ex non dolor.&lt;/div&gt;
&lt;div&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus vitae porta lectus. Suspendisse dolor mauris, scelerisque ut diam vitae, dictum ultricies est. Cras sit amet erat porttitor arcu lacinia ultricies. Morbi sodales, nisl vitae imperdiet consequat, purus nunc maximus nulla, et pharetra dolor ex non dolor.&lt;/div&gt;</code></pre>
</div>
</div>
</p>

<p>Taken from <a href="http://css3please.com/" rel="nofollow noreferrer">http://css3please.com/</a></p>

<p>As of 2017, the aforementioned site has simplified the rule set to drop legacy Internet Explorer filter and rely more in the now standard <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/transform" rel="nofollow noreferrer"><code>transform</code> property</a>:</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-css lang-css prettyprint-override"><code>.box_rotate {
  -webkit-transform: rotate(7.5deg);  /* Chrome, Opera 15+, Safari 3.1+ */
      -ms-transform: rotate(7.5deg);  /* IE 9 */
          transform: rotate(7.5deg);  /* Firefox 16+, IE 10+, Opera */
}</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus vitae porta lectus. Suspendisse dolor mauris, scelerisque ut diam vitae, dictum ultricies est. Cras sit amet erat porttitor arcu lacinia ultricies. Morbi sodales, nisl vitae imperdiet consequat, purus nunc maximus nulla, et pharetra dolor ex non dolor.&lt;/div&gt;
&lt;div class="box_rotate"&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus vitae porta lectus. Suspendisse dolor mauris, scelerisque ut diam vitae, dictum ultricies est. Cras sit amet erat porttitor arcu lacinia ultricies. Morbi sodales, nisl vitae imperdiet consequat, purus nunc maximus nulla, et pharetra dolor ex non dolor.&lt;/div&gt;
&lt;div&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus vitae porta lectus. Suspendisse dolor mauris, scelerisque ut diam vitae, dictum ultricies est. Cras sit amet erat porttitor arcu lacinia ultricies. Morbi sodales, nisl vitae imperdiet consequat, purus nunc maximus nulla, et pharetra dolor ex non dolor.&lt;/div&gt;</code></pre>
</div>
</div>
</p>


blocks|key|1695501|text|-moz-transform:+rotate(7.5deg);++/*+FF3.5%2B+*/
-o-transform:+rotate(7.5deg);++/*+Opera+10.5+*/
-webkit-transform:+rotate(7.5deg);++/*+Saf3.1%2B,+Chrome+*/
filter:++progid:DXImageTransform.Microsoft.BasicImage(rotation=1);++/*+IE6,IE7+allows+only+1,+2,+3+*/
-ms-filter:+"progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";+/*+IE8+allows+only+1+2+or+3*/|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|1695502|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre class="lang-css prettyprint-override"><code>-moz-transform: rotate(7.5deg);  /* FF3.5+ */
-o-transform: rotate(7.5deg);  /* Opera 10.5 */
-webkit-transform: rotate(7.5deg);  /* Saf3.1+, Chrome */
filter:  progid:DXImageTransform.Microsoft.BasicImage(rotation=1);  /* IE6,IE7 allows only 1, 2, 3 */
-ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"; /* IE8 allows only 1 2 or 3*/
</code></pre>


blocks|key|1695578|text|下面是一个通过一些服务器端处理来处理纯文本的方法：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1695579|public+string+RotateHtmltext(string+innerHtml)
{
+++const+string+TRANSFORMTEXT+=+"transform:+rotate(90deg);";
+++const+string+EXTRASTYLECSS+=+"<style+type='text/css'>.r90+{"
+++++++++++++++++++++++++++++++++%2B+"-webkit-"+%2B+TRANSFORMTEXT
+++++++++++++++++++++++++++++++++%2B+"-moz-"+%2B+TRANSFORMTEXT
+++++++++++++++++++++++++++++++++%2B+"-o-"+%2B+TRANSFORMTEXT
+++++++++++++++++++++++++++++++++%2B+"-ms-"+%2B+TRANSFORMTEXT
+++++++++++++++++++++++++++++++++%2B+""+%2B+TRANSFORMTEXT
+++++++++++++++++++++++++++++++++%2B+"width:1em;line-height:1ex}</style>";
+++const+string+WRAPPERDIV+=+"<div+style='display:+table-cell;+vertical-align:+middle;'>";

+++var+newinnerHtml+=+string.Join("</div>"%2BWRAPPERDIV,+Regex.Split(innerHtml,+@"<br+*/?>").Reverse());

+++newinnerHtml+=+Regex.Replace(newinnerHtml,+@"((?:<[%5E>]*>)%7C(?:[%5E<]%2B))",
+++++++++++++++++++++++++++++++++match+=>+match.Groups[1].Value.StartsWith("<")
+++++++++++++++++++++++++++++++++++++++++++++?+match.Groups[1].Value
+++++++++++++++++++++++++++++++++++++++++++++:+string.Join("",+match.Groups[1].Value.ToCharArray().Select(x=>"<div+class='r90'>"%2Bx%2B"</div>")),
+++++++++++++++++++++++++++++++++RegexOptions.Singleline);
+++return+EXTRASTYLECSS+%2B+WRAPPERDIV+%2B+newinnerHtml+%2B+"</div>";
}|code-block|syntax|javascript|1695580|这给出了一些类似的东西：|1695581|<style+type="text/css">.r90+{
-webkit-transform:+rotate(90deg);
-moz-transform:+rotate(90deg);
-o-transform:+rotate(90deg);
-ms-transform:+rotate(90deg);
transform:+rotate(90deg);
width:+1em;
line-height:+1ex;+
}</style>
<div+style="display:+table-cell;+vertical-align:+middle;">
<div+class="r90">p</div>
<div+class="r90">o</div>
<div+class="r90">s</div>
</div><div+style="display:+table-cell;+vertical-align:+middle;">
<div+class="r90">(</div>
<div+class="r90">A</div>
<div+class="r90">b</div>
<div+class="r90">s</div>
<div+class="r90">)</div>
</div>|1695582|http://jsfiddle.net/TzzHy/|offset|length|1695583|entityMap|0|LINK|mutability|MUTABLE|url^0|0|0|0|0|0|Q|0|0^^$0|@$1|2|3|4|5|6|7|V|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|W|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|X|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|Y|8|@]|9|@]|A|$E|F]]|$1|K|3|L|5|6|7|Z|8|@]|9|@$M|10|N|11|1|12]]|A|$]]|$1|O|3|-4|5|6|7|13|8|@]|9|@]|A|$]]]|P|$Q|$5|R|S|T|A|$U|L]]]]

<p>Here is one that works for plain-text with some server side processing:</p>

<pre><code>public string RotateHtmltext(string innerHtml)
{
   const string TRANSFORMTEXT = "transform: rotate(90deg);";
   const string EXTRASTYLECSS = "&lt;style type='text/css'&gt;.r90 {"
                                 + "-webkit-" + TRANSFORMTEXT
                                 + "-moz-" + TRANSFORMTEXT
                                 + "-o-" + TRANSFORMTEXT
                                 + "-ms-" + TRANSFORMTEXT
                                 + "" + TRANSFORMTEXT
                                 + "width:1em;line-height:1ex}&lt;/style&gt;";
   const string WRAPPERDIV = "&lt;div style='display: table-cell; vertical-align: middle;'&gt;";

   var newinnerHtml = string.Join("&lt;/div&gt;"+WRAPPERDIV, Regex.Split(innerHtml, @"&lt;br */?&gt;").Reverse());

   newinnerHtml = Regex.Replace(newinnerHtml, @"((?:&lt;[^&gt;]*&gt;)|(?:[^&lt;]+))",
                                 match =&gt; match.Groups[1].Value.StartsWith("&lt;")
                                             ? match.Groups[1].Value
                                             : string.Join("", match.Groups[1].Value.ToCharArray().Select(x=&gt;"&lt;div class='r90'&gt;"+x+"&lt;/div&gt;")),
                                 RegexOptions.Singleline);
   return EXTRASTYLECSS + WRAPPERDIV + newinnerHtml + "&lt;/div&gt;";
}
</code></pre>

<p>which gives something like:</p>

<pre><code>&lt;style type="text/css"&gt;.r90 {
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-o-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg);
width: 1em;
line-height: 1ex; 
}&lt;/style&gt;
&lt;div style="display: table-cell; vertical-align: middle;"&gt;
&lt;div class="r90"&gt;p&lt;/div&gt;
&lt;div class="r90"&gt;o&lt;/div&gt;
&lt;div class="r90"&gt;s&lt;/div&gt;
&lt;/div&gt;&lt;div style="display: table-cell; vertical-align: middle;"&gt;
&lt;div class="r90"&gt;(&lt;/div&gt;
&lt;div class="r90"&gt;A&lt;/div&gt;
&lt;div class="r90"&gt;b&lt;/div&gt;
&lt;div class="r90"&gt;s&lt;/div&gt;
&lt;div class="r90"&gt;)&lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p><a href="http://jsfiddle.net/TzzHy/" rel="nofollow">http://jsfiddle.net/TzzHy/</a></p>


blocks|key|1695694|text|在尝试了两个多小时后，我可以放心地说，到目前为止提到的所有方法都不适用于跨浏览器，甚至不适用于IE，甚至跨浏览器版本……|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1695695|例如(排名靠前的答案)：|1695696|+filter:++progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083);++/*+IE6,IE7+*/
+++++-ms-filter:+"progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083)";+/*+IE8+*/|code-block|syntax|javascript|1695697|在过滤器中旋转两次，一次用于filter，一次用于-ms-+IE9，因此...|1695698|所有其他提到的方法也不起作用，至少如果你没有设置表格标题单元格的固定高度/宽度(带背景颜色)，它应该自动调整到最高元素的大小。|1695699|因此，为了详细说明Nathan+Long提出的服务器端图像生成，这实际上是唯一通用的方法，下面是我的通用处理程序(*.ashx+)的VB.NET代码：|1695700|Imports+System.Web
Imports+System.Web.Services


Public+Class+GenerateImage
++++Implements+System.Web.IHttpHandler


++++Sub+ProcessRequest(ByVal+context+As+HttpContext)+Implements+IHttpHandler.ProcessRequest
++++++++'context.Response.ContentType+=+"text/plain"
++++++++'context.Response.Write("Hello+World!")
++++++++context.Response.ContentType+=+"image/png"

++++++++Dim+strText+As+String+=+context.Request.QueryString("text")
++++++++Dim+strRotate+As+String+=+context.Request.QueryString("rotate")
++++++++Dim+strBGcolor+As+String+=+context.Request.QueryString("bgcolor")

++++++++Dim+bRotate+As+Boolean+=+True

++++++++If+String.IsNullOrEmpty(strText)+Then
++++++++++++strText+=+"No+Text"
++++++++End+If


++++++++Try
++++++++++++If+Not+String.IsNullOrEmpty(strRotate)+Then
++++++++++++++++bRotate+=+System.Convert.ToBoolean(strRotate)
++++++++++++End+If
++++++++Catch+ex+As+Exception

++++++++End+Try


++++++++'Dim+img+As+System.Drawing.Image+=+GenerateImage(strText,+"Arial",+bRotate)
++++++++'Dim+img+As+System.Drawing.Image+=+CreateBitmapImage(strText,+bRotate)

++++++++'+Generic+error+in+GDI%2B
++++++++'img.Save(context.Response.OutputStream,+System.Drawing.Imaging.ImageFormat.Png)

++++++++'Dim+bm+As+System.Drawing.Bitmap+=+New+System.Drawing.Bitmap(img)
++++++++'bm.Save(context.Response.OutputStream,+System.Drawing.Imaging.ImageFormat.Png)

++++++++Using+msTempOutputStream+As+New+System.IO.MemoryStream
++++++++++++'Dim+img+As+System.Drawing.Image+=+GenerateImage(strText,+"Arial",+bRotate)
++++++++++++Using+img+As+System.Drawing.Image+=+CreateBitmapImage(strText,+bRotate,+strBGcolor)
++++++++++++++++img.Save(msTempOutputStream,+System.Drawing.Imaging.ImageFormat.Png)
++++++++++++++++msTempOutputStream.Flush()

++++++++++++++++context.Response.Buffer+=+True
++++++++++++++++context.Response.ContentType+=+"image/png"
++++++++++++++++context.Response.BinaryWrite(msTempOutputStream.ToArray())
++++++++++++End+Using+'+img

++++++++End+Using+'+msTempOutputStream

++++End+Sub+'+ProcessRequest


++++Private+Function+CreateBitmapImage(strImageText+As+String)+As+System.Drawing.Image
++++++++Return+CreateBitmapImage(strImageText,+True)
++++End+Function+'+CreateBitmapImage


++++Private+Function+CreateBitmapImage(strImageText+As+String,+bRotate+As+Boolean)+As+System.Drawing.Image
++++++++Return+CreateBitmapImage(strImageText,+bRotate,+Nothing)
++++End+Function


++++Private+Function+InvertMeAColour(ColourToInvert+As+System.Drawing.Color)+As+System.Drawing.Color
++++++++Const+RGBMAX+As+Integer+=+255
++++++++Return+System.Drawing.Color.FromArgb(RGBMAX+-+ColourToInvert.R,+RGBMAX+-+ColourToInvert.G,+RGBMAX+-+ColourToInvert.B)
++++End+Function



++++Private+Function+CreateBitmapImage(strImageText+As+String,+bRotate+As+Boolean,+strBackgroundColor+As+String)+As+System.Drawing.Image
++++++++Dim+bmpEndImage+As+System.Drawing.Bitmap+=+Nothing

++++++++If+String.IsNullOrEmpty(strBackgroundColor)+Then
++++++++++++strBackgroundColor+=+"#E0E0E0"
++++++++End+If

++++++++Dim+intWidth+As+Integer+=+0
++++++++Dim+intHeight+As+Integer+=+0


++++++++Dim+bgColor+As+System.Drawing.Color+=+System.Drawing.Color.LemonChiffon+'+LightGray
++++++++bgColor+=+System.Drawing.ColorTranslator.FromHtml(strBackgroundColor)

++++++++Dim+TextColor+As+System.Drawing.Color+=+System.Drawing.Color.Black
++++++++TextColor+=+InvertMeAColour(bgColor)

++++++++'TextColor+=+Color.FromArgb(102,+102,+102)



++++++++'+Create+the+Font+object+for+the+image+text+drawing.
++++++++Using+fntThisFont+As+New+System.Drawing.Font("Arial",+11,+System.Drawing.FontStyle.Bold,+System.Drawing.GraphicsUnit.Pixel)

++++++++++++'+Create+a+graphics+object+to+measure+the+text's+width+and+height.
++++++++++++Using+bmpInitialImage+As+New+System.Drawing.Bitmap(1,+1)

++++++++++++++++Using+gStringMeasureGraphics+As+System.Drawing.Graphics+=+System.Drawing.Graphics.FromImage(bmpInitialImage)
++++++++++++++++++++'+This+is+where+the+bitmap+size+is+determined.
++++++++++++++++++++intWidth+=+CInt(gStringMeasureGraphics.MeasureString(strImageText,+fntThisFont).Width)
++++++++++++++++++++intHeight+=+CInt(gStringMeasureGraphics.MeasureString(strImageText,+fntThisFont).Height)

++++++++++++++++++++'+Create+the+bmpImage+again+with+the+correct+size+for+the+text+and+font.
++++++++++++++++++++bmpEndImage+=+New+System.Drawing.Bitmap(bmpInitialImage,+New+System.Drawing.Size(intWidth,+intHeight))

++++++++++++++++++++'+Add+the+colors+to+the+new+bitmap.
++++++++++++++++++++Using+gNewGraphics+As+System.Drawing.Graphics+=+System.Drawing.Graphics.FromImage(bmpEndImage)
++++++++++++++++++++++++'+Set+Background+color
++++++++++++++++++++++++'gNewGraphics.Clear(Color.White)
++++++++++++++++++++++++gNewGraphics.Clear(bgColor)
++++++++++++++++++++++++gNewGraphics.SmoothingMode+=+System.Drawing.Drawing2D.SmoothingMode.AntiAlias
++++++++++++++++++++++++gNewGraphics.TextRenderingHint+=+System.Drawing.Text.TextRenderingHint.AntiAlias


++++++++++++++++++++++++''''

++++++++++++++++++++++++'gNewGraphics.TranslateTransform(bmpEndImage.Width,+bmpEndImage.Height)
++++++++++++++++++++++++'gNewGraphics.RotateTransform(180)
++++++++++++++++++++++++'gNewGraphics.RotateTransform(0)
++++++++++++++++++++++++'gNewGraphics.TextRenderingHint+=+System.Drawing.Text.TextRenderingHint.SystemDefault


++++++++++++++++++++++++gNewGraphics.DrawString(strImageText,+fntThisFont,+New+System.Drawing.SolidBrush(TextColor),+0,+0)

++++++++++++++++++++++++gNewGraphics.Flush()

++++++++++++++++++++++++If+bRotate+Then
++++++++++++++++++++++++++++'bmpEndImage+=+rotateImage(bmpEndImage,+90)
++++++++++++++++++++++++++++'bmpEndImage+=+RotateImage(bmpEndImage,+New+PointF(0,+0),+90)
++++++++++++++++++++++++++++'bmpEndImage.RotateFlip(RotateFlipType.Rotate90FlipNone)
++++++++++++++++++++++++++++bmpEndImage.RotateFlip(System.Drawing.RotateFlipType.Rotate270FlipNone)
++++++++++++++++++++++++End+If+'+bRotate

++++++++++++++++++++End+Using+'+gNewGraphics

++++++++++++++++End+Using+'+gStringMeasureGraphics

++++++++++++End+Using+'+bmpInitialImage

++++++++End+Using+'+fntThisFont

++++++++Return+bmpEndImage
++++End+Function+'+CreateBitmapImage


++++'+http://msdn.microsoft.com/en-us/library/3zxbwxch.aspx
++++'+http://msdn.microsoft.com/en-us/library/7e1w5dhw.aspx
++++'+http://www.informit.com/guides/content.aspx?g=dotnet&seqNum=286
++++'+http://road-blogs.blogspot.com/2011/01/rotate-text-in-ssrs.html
++++Public+Shared+Function+GenerateImage_CrappyOldReportingServiceVariant(ByVal+strText+As+String,+ByVal+strFont+As+String,+bRotate+As+Boolean)+As+System.Drawing.Image
++++++++Dim+bgColor+As+System.Drawing.Color+=+System.Drawing.Color.LemonChiffon+'+LightGray
++++++++bgColor+=+System.Drawing.ColorTranslator.FromHtml("#E0E0E0")


++++++++Dim+TextColor+As+System.Drawing.Color+=+System.Drawing.Color.Black
++++++++'TextColor+=+System.Drawing.Color.FromArgb(255,+0,+0,+255)

++++++++If+String.IsNullOrEmpty(strFont)+Then
++++++++++++strFont+=+"Arial"
++++++++Else
++++++++++++If+strFont.Trim().Equals(String.Empty)+Then
++++++++++++++++strFont+=+"Arial"
++++++++++++End+If
++++++++End+If


++++++++'Dim+fsFontStyle+As+System.Drawing.FontStyle+=+System.Drawing.FontStyle.Regular
++++++++Dim+fsFontStyle+As+System.Drawing.FontStyle+=+System.Drawing.FontStyle.Bold
++++++++Dim+fontFamily+As+New+System.Drawing.FontFamily(strFont)
++++++++Dim+iFontSize+As+Integer+=+8+'//Change+this+as+needed


++++++++'+vice-versa,+because+270°+turn
++++++++'Dim+height+As+Double+=+2.25
++++++++Dim+height+As+Double+=+4
++++++++Dim+width+As+Double+=+1

++++++++'+width+=+10
++++++++'+height+=+10

++++++++Dim+bmpImage+As+New+System.Drawing.Bitmap(1,+1)
++++++++Dim+iHeight+As+Integer+=+CInt(height+*+0.393700787+*+bmpImage.VerticalResolution)+'y+DPI
++++++++Dim+iWidth+As+Integer+=+CInt(width+*+0.393700787+*+bmpImage.HorizontalResolution)+'x+DPI

++++++++bmpImage+=+New+System.Drawing.Bitmap(bmpImage,+New+System.Drawing.Size(iWidth,+iHeight))



++++++++'//+Create+the+Font+object+for+the+image+text+drawing.
++++++++'Dim+MyFont+As+New+System.Drawing.Font("Arial",+iFontSize,+fsFontStyle,+System.Drawing.GraphicsUnit.Point)
++++++++'//+Create+a+graphics+object+to+measure+the+text's+width+and+height.
++++++++Dim+MyGraphics+As+System.Drawing.Graphics+=+System.Drawing.Graphics.FromImage(bmpImage)
++++++++MyGraphics.Clear(bgColor)


++++++++Dim+stringFormat+As+New+System.Drawing.StringFormat()
++++++++stringFormat.FormatFlags+=+System.Drawing.StringFormatFlags.DirectionVertical
++++++++'stringFormat.FormatFlags+=+System.Drawing.StringFormatFlags.DirectionVertical+Or+System.Drawing.StringFormatFlags.DirectionRightToLeft
++++++++Dim+solidBrush+As+New+System.Drawing.SolidBrush(TextColor)
++++++++Dim+pointF+As+New+System.Drawing.PointF(CSng(iWidth+/+2+-+iFontSize+/+2+-+2),+5)
++++++++Dim+font+As+New+System.Drawing.Font(fontFamily,+iFontSize,+fsFontStyle,+System.Drawing.GraphicsUnit.Point)


++++++++MyGraphics.TranslateTransform(bmpImage.Width,+bmpImage.Height)
++++++++MyGraphics.RotateTransform(180)
++++++++MyGraphics.TextRenderingHint+=+System.Drawing.Text.TextRenderingHint.SystemDefault
++++++++MyGraphics.DrawString(strText,+font,+solidBrush,+pointF,+stringFormat)
++++++++MyGraphics.ResetTransform()

++++++++MyGraphics.Flush()

++++++++'If+Not+bRotate+Then
++++++++'bmpImage.RotateFlip(System.Drawing.RotateFlipType.Rotate90FlipNone)
++++++++'End+If

++++++++Return+bmpImage
++++End+Function+'+GenerateImage



++++ReadOnly+Property+IsReusable()+As+Boolean+Implements+IHttpHandler.IsReusable
++++++++Get
++++++++++++Return+False
++++++++End+Get
++++End+Property+'+IsReusable


End+Class|1695701|请注意，如果您认为这部分|1695702|++++++++Using+msTempOutputStream+As+New+System.IO.MemoryStream
++++++++++++'Dim+img+As+System.Drawing.Image+=+GenerateImage(strText,+"Arial",+bRotate)
++++++++++++Using+img+As+System.Drawing.Image+=+CreateBitmapImage(strText,+bRotate,+strBGcolor)
++++++++++++++++img.Save(msTempOutputStream,+System.Drawing.Imaging.ImageFormat.Png)
++++++++++++++++msTempOutputStream.Flush()

++++++++++++++++context.Response.Buffer+=+True
++++++++++++++++context.Response.ContentType+=+"image/png"
++++++++++++++++context.Response.BinaryWrite(msTempOutputStream.ToArray())
++++++++++++End+Using+'+img

++++++++End+Using+'+msTempOutputStream|1695703|可以替换为|1695704|img.Save(context.Response.OutputStream,+System.Drawing.Imaging.ImageFormat.Png)|1695705|因为它可以在开发服务器上工作，所以如果您将其部署到Windows2003IIS6服务器上，那么您就大错特错地认为相同的代码不会抛出通用的GDI%2B异常……|1695706|然后像这样使用它：|1695707|<img+alt="bla"+src="GenerateImage.ashx?no_cache=123&text=Hello%2520World&rotate=true"+/>|1695708|entityMap^0|0|0|0|0|0|0|0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|16|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|17|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|18|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|19|8|@]|9|@]|A|$]]|$1|K|3|L|5|6|7|1A|8|@]|9|@]|A|$]]|$1|M|3|N|5|6|7|1B|8|@]|9|@]|A|$]]|$1|O|3|P|5|F|7|1C|8|@]|9|@]|A|$G|H]]|$1|Q|3|R|5|6|7|1D|8|@]|9|@]|A|$]]|$1|S|3|T|5|F|7|1E|8|@]|9|@]|A|$G|H]]|$1|U|3|V|5|6|7|1F|8|@]|9|@]|A|$]]|$1|W|3|X|5|F|7|1G|8|@]|9|@]|A|$G|H]]|$1|Y|3|Z|5|6|7|1H|8|@]|9|@]|A|$]]|$1|10|3|11|5|6|7|1I|8|@]|9|@]|A|$]]|$1|12|3|13|5|F|7|1J|8|@]|9|@]|A|$G|H]]|$1|14|3|-4|5|6|7|1K|8|@]|9|@]|A|$]]]|15|$]]

<p>After having tried for over two hours, I can safely say that all the method mentioned so far don't work across browsers, or for IE even across browser versions...</p>

<p>For example (top upvoted answer):</p>

<pre><code> filter:  progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083);  /* IE6,IE7 */
     -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083)"; /* IE8 */
</code></pre>

<p>rotates twice in IE9, once for filter, and once for -ms-filter, so...</p>

<p>All other mentioned methods do not work either, at least not if you have to set no fixed height/width of the table header cell (with background color), where it should automatically adjust to size of the highest element.</p>

<p>So to elaborate on the server-side image generation proposed by Nathan Long, which is really the only universially working method, here my VB.NET code for a generic handler (*.ashx ):</p>

<pre><code>Imports System.Web
Imports System.Web.Services


Public Class GenerateImage
    Implements System.Web.IHttpHandler


    Sub ProcessRequest(ByVal context As HttpContext) Implements IHttpHandler.ProcessRequest
        'context.Response.ContentType = "text/plain"
        'context.Response.Write("Hello World!")
        context.Response.ContentType = "image/png"

        Dim strText As String = context.Request.QueryString("text")
        Dim strRotate As String = context.Request.QueryString("rotate")
        Dim strBGcolor As String = context.Request.QueryString("bgcolor")

        Dim bRotate As Boolean = True

        If String.IsNullOrEmpty(strText) Then
            strText = "No Text"
        End If


        Try
            If Not String.IsNullOrEmpty(strRotate) Then
                bRotate = System.Convert.ToBoolean(strRotate)
            End If
        Catch ex As Exception

        End Try


        'Dim img As System.Drawing.Image = GenerateImage(strText, "Arial", bRotate)
        'Dim img As System.Drawing.Image = CreateBitmapImage(strText, bRotate)

        ' Generic error in GDI+
        'img.Save(context.Response.OutputStream, System.Drawing.Imaging.ImageFormat.Png)

        'Dim bm As System.Drawing.Bitmap = New System.Drawing.Bitmap(img)
        'bm.Save(context.Response.OutputStream, System.Drawing.Imaging.ImageFormat.Png)

        Using msTempOutputStream As New System.IO.MemoryStream
            'Dim img As System.Drawing.Image = GenerateImage(strText, "Arial", bRotate)
            Using img As System.Drawing.Image = CreateBitmapImage(strText, bRotate, strBGcolor)
                img.Save(msTempOutputStream, System.Drawing.Imaging.ImageFormat.Png)
                msTempOutputStream.Flush()

                context.Response.Buffer = True
                context.Response.ContentType = "image/png"
                context.Response.BinaryWrite(msTempOutputStream.ToArray())
            End Using ' img

        End Using ' msTempOutputStream

    End Sub ' ProcessRequest


    Private Function CreateBitmapImage(strImageText As String) As System.Drawing.Image
        Return CreateBitmapImage(strImageText, True)
    End Function ' CreateBitmapImage


    Private Function CreateBitmapImage(strImageText As String, bRotate As Boolean) As System.Drawing.Image
        Return CreateBitmapImage(strImageText, bRotate, Nothing)
    End Function


    Private Function InvertMeAColour(ColourToInvert As System.Drawing.Color) As System.Drawing.Color
        Const RGBMAX As Integer = 255
        Return System.Drawing.Color.FromArgb(RGBMAX - ColourToInvert.R, RGBMAX - ColourToInvert.G, RGBMAX - ColourToInvert.B)
    End Function



    Private Function CreateBitmapImage(strImageText As String, bRotate As Boolean, strBackgroundColor As String) As System.Drawing.Image
        Dim bmpEndImage As System.Drawing.Bitmap = Nothing

        If String.IsNullOrEmpty(strBackgroundColor) Then
            strBackgroundColor = "#E0E0E0"
        End If

        Dim intWidth As Integer = 0
        Dim intHeight As Integer = 0


        Dim bgColor As System.Drawing.Color = System.Drawing.Color.LemonChiffon ' LightGray
        bgColor = System.Drawing.ColorTranslator.FromHtml(strBackgroundColor)

        Dim TextColor As System.Drawing.Color = System.Drawing.Color.Black
        TextColor = InvertMeAColour(bgColor)

        'TextColor = Color.FromArgb(102, 102, 102)



        ' Create the Font object for the image text drawing.
        Using fntThisFont As New System.Drawing.Font("Arial", 11, System.Drawing.FontStyle.Bold, System.Drawing.GraphicsUnit.Pixel)

            ' Create a graphics object to measure the text's width and height.
            Using bmpInitialImage As New System.Drawing.Bitmap(1, 1)

                Using gStringMeasureGraphics As System.Drawing.Graphics = System.Drawing.Graphics.FromImage(bmpInitialImage)
                    ' This is where the bitmap size is determined.
                    intWidth = CInt(gStringMeasureGraphics.MeasureString(strImageText, fntThisFont).Width)
                    intHeight = CInt(gStringMeasureGraphics.MeasureString(strImageText, fntThisFont).Height)

                    ' Create the bmpImage again with the correct size for the text and font.
                    bmpEndImage = New System.Drawing.Bitmap(bmpInitialImage, New System.Drawing.Size(intWidth, intHeight))

                    ' Add the colors to the new bitmap.
                    Using gNewGraphics As System.Drawing.Graphics = System.Drawing.Graphics.FromImage(bmpEndImage)
                        ' Set Background color
                        'gNewGraphics.Clear(Color.White)
                        gNewGraphics.Clear(bgColor)
                        gNewGraphics.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.AntiAlias
                        gNewGraphics.TextRenderingHint = System.Drawing.Text.TextRenderingHint.AntiAlias


                        ''''

                        'gNewGraphics.TranslateTransform(bmpEndImage.Width, bmpEndImage.Height)
                        'gNewGraphics.RotateTransform(180)
                        'gNewGraphics.RotateTransform(0)
                        'gNewGraphics.TextRenderingHint = System.Drawing.Text.TextRenderingHint.SystemDefault


                        gNewGraphics.DrawString(strImageText, fntThisFont, New System.Drawing.SolidBrush(TextColor), 0, 0)

                        gNewGraphics.Flush()

                        If bRotate Then
                            'bmpEndImage = rotateImage(bmpEndImage, 90)
                            'bmpEndImage = RotateImage(bmpEndImage, New PointF(0, 0), 90)
                            'bmpEndImage.RotateFlip(RotateFlipType.Rotate90FlipNone)
                            bmpEndImage.RotateFlip(System.Drawing.RotateFlipType.Rotate270FlipNone)
                        End If ' bRotate

                    End Using ' gNewGraphics

                End Using ' gStringMeasureGraphics

            End Using ' bmpInitialImage

        End Using ' fntThisFont

        Return bmpEndImage
    End Function ' CreateBitmapImage


    ' http://msdn.microsoft.com/en-us/library/3zxbwxch.aspx
    ' http://msdn.microsoft.com/en-us/library/7e1w5dhw.aspx
    ' http://www.informit.com/guides/content.aspx?g=dotnet&amp;seqNum=286
    ' http://road-blogs.blogspot.com/2011/01/rotate-text-in-ssrs.html
    Public Shared Function GenerateImage_CrappyOldReportingServiceVariant(ByVal strText As String, ByVal strFont As String, bRotate As Boolean) As System.Drawing.Image
        Dim bgColor As System.Drawing.Color = System.Drawing.Color.LemonChiffon ' LightGray
        bgColor = System.Drawing.ColorTranslator.FromHtml("#E0E0E0")


        Dim TextColor As System.Drawing.Color = System.Drawing.Color.Black
        'TextColor = System.Drawing.Color.FromArgb(255, 0, 0, 255)

        If String.IsNullOrEmpty(strFont) Then
            strFont = "Arial"
        Else
            If strFont.Trim().Equals(String.Empty) Then
                strFont = "Arial"
            End If
        End If


        'Dim fsFontStyle As System.Drawing.FontStyle = System.Drawing.FontStyle.Regular
        Dim fsFontStyle As System.Drawing.FontStyle = System.Drawing.FontStyle.Bold
        Dim fontFamily As New System.Drawing.FontFamily(strFont)
        Dim iFontSize As Integer = 8 '//Change this as needed


        ' vice-versa, because 270° turn
        'Dim height As Double = 2.25
        Dim height As Double = 4
        Dim width As Double = 1

        ' width = 10
        ' height = 10

        Dim bmpImage As New System.Drawing.Bitmap(1, 1)
        Dim iHeight As Integer = CInt(height * 0.393700787 * bmpImage.VerticalResolution) 'y DPI
        Dim iWidth As Integer = CInt(width * 0.393700787 * bmpImage.HorizontalResolution) 'x DPI

        bmpImage = New System.Drawing.Bitmap(bmpImage, New System.Drawing.Size(iWidth, iHeight))



        '// Create the Font object for the image text drawing.
        'Dim MyFont As New System.Drawing.Font("Arial", iFontSize, fsFontStyle, System.Drawing.GraphicsUnit.Point)
        '// Create a graphics object to measure the text's width and height.
        Dim MyGraphics As System.Drawing.Graphics = System.Drawing.Graphics.FromImage(bmpImage)
        MyGraphics.Clear(bgColor)


        Dim stringFormat As New System.Drawing.StringFormat()
        stringFormat.FormatFlags = System.Drawing.StringFormatFlags.DirectionVertical
        'stringFormat.FormatFlags = System.Drawing.StringFormatFlags.DirectionVertical Or System.Drawing.StringFormatFlags.DirectionRightToLeft
        Dim solidBrush As New System.Drawing.SolidBrush(TextColor)
        Dim pointF As New System.Drawing.PointF(CSng(iWidth / 2 - iFontSize / 2 - 2), 5)
        Dim font As New System.Drawing.Font(fontFamily, iFontSize, fsFontStyle, System.Drawing.GraphicsUnit.Point)


        MyGraphics.TranslateTransform(bmpImage.Width, bmpImage.Height)
        MyGraphics.RotateTransform(180)
        MyGraphics.TextRenderingHint = System.Drawing.Text.TextRenderingHint.SystemDefault
        MyGraphics.DrawString(strText, font, solidBrush, pointF, stringFormat)
        MyGraphics.ResetTransform()

        MyGraphics.Flush()

        'If Not bRotate Then
        'bmpImage.RotateFlip(System.Drawing.RotateFlipType.Rotate90FlipNone)
        'End If

        Return bmpImage
    End Function ' GenerateImage



    ReadOnly Property IsReusable() As Boolean Implements IHttpHandler.IsReusable
        Get
            Return False
        End Get
    End Property ' IsReusable


End Class
</code></pre>

<p>Note that if you think that this part </p>

<pre><code>        Using msTempOutputStream As New System.IO.MemoryStream
            'Dim img As System.Drawing.Image = GenerateImage(strText, "Arial", bRotate)
            Using img As System.Drawing.Image = CreateBitmapImage(strText, bRotate, strBGcolor)
                img.Save(msTempOutputStream, System.Drawing.Imaging.ImageFormat.Png)
                msTempOutputStream.Flush()

                context.Response.Buffer = True
                context.Response.ContentType = "image/png"
                context.Response.BinaryWrite(msTempOutputStream.ToArray())
            End Using ' img

        End Using ' msTempOutputStream
</code></pre>

<p>can be replaced with </p>

<pre><code>img.Save(context.Response.OutputStream, System.Drawing.Imaging.ImageFormat.Png)
</code></pre>

<p>because it works on the development server, then you are sorely mistaken to assume the very same code wouldn't throw a Generic GDI+ exception if you deploy it to a Windows 2003 IIS 6 server...</p>

<p>then use it like this:</p>

<pre><code>&lt;img alt="bla" src="GenerateImage.ashx?no_cache=123&amp;text=Hello%20World&amp;rotate=true" /&gt;
</code></pre>


blocks|key|1695763|text|我使用的是Font+Awesome库，可以通过将以下内容附加到任何html元素来实现此效果。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1695764|<div+class="fa+fa-rotate-270">
++My+Test+Text
</div>|code-block|syntax|javascript|1695765|您的里程可能会有所不同。|1695766|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

<p>I was using the Font Awesome library and was able to achieve this affect by tacking on the following to any html element. </p>

<pre><code>&lt;div class="fa fa-rotate-270"&gt;
  My Test Text
&lt;/div&gt;
</code></pre>

<p>Your mileage may vary.</p>


blocks|key|1480627|text|看看这个，这是我在寻找IE7的解决方案时发现的。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1480628|对于css+only+vibes来说，完全是一个很酷的解决方案|1480629|谢谢你的灵魂|1480630|heres+the+link|offset|length|1480631|这是堆栈溢出链接，我在这里遇到了这个link+meow|1480632|+++++++++.vertical-text-vibes{

++++++++++++++++/*+this+is+for+shity+"non+IE"+browsers
+++++++++++++++++++that+dosn't+support+writing-mode+*/
++++++++++++++++-webkit-transform:+translate(1.1em,0)+rotate(90deg);
+++++++++++++++++++-moz-transform:+translate(1.1em,0)+rotate(90deg);
+++++++++++++++++++++-o-transform:+translate(1.1em,0)+rotate(90deg);
++++++++++++++++++++++++transform:+translate(1.1em,0)+rotate(90deg);
++++++++++++++++-webkit-transform-origin:+0+0;
+++++++++++++++++++-moz-transform-origin:+0+0;
+++++++++++++++++++++-o-transform-origin:+0+0;
++++++++++++++++++++++++transform-origin:+0+0;++
+++++++++++++/*+IE9%2B+*/++++ms-transform:+none;++++
+++++++++++++++++++-ms-transform-origin:+none;++++
++++++++/*+IE8%2B+*/++++-ms-writing-mode:+tb-rl;++++
+++/*+IE7+and+below+*/++++*writing-mode:+tb-rl;

++++++++++++}|code-block|syntax|javascript|1480633|entityMap|0|LINK|mutability|MUTABLE|url|https://gist.github.com/aiboy/7406727|1|https://stackoverflow.com/questions/17286651/vertical-text-in-ie7-ie8-ie9-and-ie10-with-css-only^0|0|0|0|0|E|0|0|I|9|1|0|0^^$0|@$1|2|3|4|5|6|7|10|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|11|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|12|8|@]|9|@]|A|$]]|$1|F|3|G|5|6|7|13|8|@]|9|@$H|14|I|15|1|16]]|A|$]]|$1|J|3|K|5|6|7|17|8|@]|9|@$H|18|I|19|1|1A]]|A|$]]|$1|L|3|M|5|N|7|1B|8|@]|9|@]|A|$O|P]]|$1|Q|3|-4|5|6|7|1C|8|@]|9|@]|A|$]]]|R|$S|$5|T|U|V|A|$W|X]]|Y|$5|T|U|V|A|$W|Z]]]]

<p>Have a look at this, i found this while looking for a solution for IE 7. </p>

<p>totally a cool solution for css only vibes</p>

<p>Thanks aiboy for the soultion</p>

<p><a href="https://gist.github.com/aiboy/7406727" rel="nofollow noreferrer" title="The link">heres the link</a></p>

<p>and here is the stack-overflow link where i came across this <a href="https://stackoverflow.com/questions/17286651/vertical-text-in-ie7-ie8-ie9-and-ie10-with-css-only">link meow</a></p>

<pre><code>         .vertical-text-vibes{

                /* this is for shity "non IE" browsers
                   that dosn't support writing-mode */
                -webkit-transform: translate(1.1em,0) rotate(90deg);
                   -moz-transform: translate(1.1em,0) rotate(90deg);
                     -o-transform: translate(1.1em,0) rotate(90deg);
                        transform: translate(1.1em,0) rotate(90deg);
                -webkit-transform-origin: 0 0;
                   -moz-transform-origin: 0 0;
                     -o-transform-origin: 0 0;
                        transform-origin: 0 0;  
             /* IE9+ */    ms-transform: none;    
                   -ms-transform-origin: none;    
        /* IE8+ */    -ms-writing-mode: tb-rl;    
   /* IE7 and below */    *writing-mode: tb-rl;

            }
</code></pre>


blocks|key|1480758|text|我对社区的第一个贡献，示例为旋转一个简单的文本和一个表头，只使用html和css。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1480759|​|1480760|📷|atomic|offset|length|1480761|1480762|HTML|1480763|<div+class="rotate">text</div>|code-block|syntax|javascript|1480764|CSS|1480765|.rotate+{
++display:inline-block;
++filter:+progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
++-webkit-transform:+rotate(270deg);
++-ms-transform:+rotate(270deg);
++transform:+rotate(270deg);
}|1480766|Here+an+example+in+jsfiddle|1480767|entityMap|0|IMAGE|mutability|IMMUTABLE|imageUrl|https://ask.qcloudimg.com/http-save/yehe-900000/c25b8b571be7c8ce2a39ec3f60043949.png|imageAlt|1|LINK|MUTABLE|url|http://jsfiddle.net/omardiaze/a2uxgm44/^0|0|0|0|1|0|0|0|0|0|0|0|0|R|1|0^^$0|@$1|2|3|4|5|6|7|1A|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|1B|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|1C|8|@]|9|@$G|1D|H|1E|1|1F]]|A|$]]|$1|I|3|C|5|6|7|1G|8|@]|9|@]|A|$]]|$1|J|3|K|5|6|7|1H|8|@]|9|@]|A|$]]|$1|L|3|M|5|N|7|1I|8|@]|9|@]|A|$O|P]]|$1|Q|3|R|5|6|7|1J|8|@]|9|@]|A|$]]|$1|S|3|T|5|N|7|1K|8|@]|9|@]|A|$O|P]]|$1|U|3|V|5|6|7|1L|8|@]|9|@$G|1M|H|1N|1|1O]]|A|$]]|$1|W|3|-4|5|6|7|1P|8|@]|9|@]|A|$]]]|X|$Y|$5|Z|10|11|A|$12|13|14|-4]]|15|$5|16|10|17|A|$18|19]]]]

<p>My first contribution to the community , example as rotating a simple text and the header of a table, only using html and css.</p>

<p><img src="https://i.stack.imgur.com/AYhIl.png" alt="enter image description here"></p>

<p>HTML</p>

<pre><code>&lt;div class="rotate"&gt;text&lt;/div&gt;
</code></pre>

<p>CSS</p>

<pre><code>.rotate {
  display:inline-block;
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
  -webkit-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  transform: rotate(270deg);
}
</code></pre>

<p><a href="http://jsfiddle.net/omardiaze/a2uxgm44/" rel="nofollow noreferrer">Here an example in jsfiddle</a></p>


blocks|key|1695979|text|另一种解决方案：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1695980|(function+()+{

++++var+make_rotated_text+=+function+(text)
++++{
++++++++var+can+=+document.createElement+('canvas');
++++++++can.width+=+10;
++++++++can.height+=+10;
++++++++var+ctx=can.getContext+("2d");
++++++++ctx.font="20px+Verdana";
++++++++var+m+=+ctx.measureText(text);
++++++++can.width+=+20;
++++++++can.height+=+m.width;
++++++++ctx.font="20px+Verdana";
++++++++ctx.fillStyle+=+"#000000";
++++++++ctx.rotate(90+*+(Math.PI+/+180));
++++++++ctx.fillText+(text,+0,+-2);
++++++++return+can;
++++};

++++var+canvas+=+make_rotated_text+("Hellooooo+:D");
++++var+body+=+document.getElementsByTagName+('body')[0];
++++body.appendChild+(canvas);

})+();|code-block|syntax|javascript|1695981|我必须承认这是相当的黑客，但这是一个简单的解决方案，如果你想避免臃肿你的css。|1695982|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

<p>Another solution:</p>

<pre><code>(function () {

    var make_rotated_text = function (text)
    {
        var can = document.createElement ('canvas');
        can.width = 10;
        can.height = 10;
        var ctx=can.getContext ("2d");
        ctx.font="20px Verdana";
        var m = ctx.measureText(text);
        can.width = 20;
        can.height = m.width;
        ctx.font="20px Verdana";
        ctx.fillStyle = "#000000";
        ctx.rotate(90 * (Math.PI / 180));
        ctx.fillText (text, 0, -2);
        return can;
    };

    var canvas = make_rotated_text ("Hellooooo :D");
    var body = document.getElementsByTagName ('body')[0];
    body.appendChild (canvas);

}) ();
</code></pre>

<p>I do absolutely admit that this is quite hackish, but it's a simple solution if you want to avoid bloating your css.</p>


<p>Is there a (portable) way to rotate text in a HTML table cell by 90°?</p>

<p>(I have a table with many columns and much text for the headings, so I'd like to write it vertically to save space.)</p>


Vertical (rotated) text in HTML table

服务器

jQuery

有没有一种(便携的)方法可以将HTML表单元格中的文本旋转90°？(我有一个包含许多列和许多标题文本的表，因此为了节省空间，我想垂直书写它。)

问HTML表格中的垂直(旋转)文本
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问HTML表格中的垂直(旋转)文本EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问HTML表格中的垂直(旋转)文本
EN