相关疑难解决方法(0)

我有一个显示垂直文本的多浏览器页面.

作为一个丑陋的黑客,让文本在所有浏览器中垂直渲染我创建了一个自定义页面处理程序,它返回一个垂直绘制文本的PNG.

这是我的基本代码(C#3,但对其他任何版本的细微更改为1):

Font f = GetSystemConfiguredFont();
//this sets the text to be rotated 90deg clockwise (i.e. down)
StringFormat stringFormat = new StringFormat { FormatFlags = StringFormatFlags.DirectionVertical };

SizeF size;
// creates 1Kx1K image buffer and uses it to find out how bit the image needs to be to fit the text
using ( Image imageg = (Image) new Bitmap( 1000, 1000 ) )
    size = Graphics.FromImage( imageg ).
        MeasureString( text, f, 25, stringFormat );

using ( Bitmap image = …

我使用以下css旋转表头单元格内的文本,但标题单元格的宽度与文本是水平的相同.如何旋转文本,宽度将自动减少..

    table#MyTable tr th a{
    color: #FFFFFF;
    display: block;
    /*Firefox*/
    -moz-transform: rotate(-90deg);
    /*Safari*/
    -webkit-transform: rotate(-90deg);
    /*Opera*/
    -o-transform: rotate(-90deg);
    /*IE*/
    writing-mode: tb-rl;
    filter: flipv fliph;
    padding: 60px 1px;
}

我想通过相隔90度的四个方向在网页上旋转图像.我更喜欢这种情况发生在客户端机器上.这可以用css完成吗？或者我需要使用javascript吗？

感谢您的时间.

我想在 HTML5 中有一个这样的表格：

也就是说，第 2 列的标题旋转 270°，垂直对齐底部，水平居中，黑色背景上的白色字体，但没有为标题行/列设置明确的高度，最好不必求助于使用 JavaScript 进行布局...

现在，直到现在，我通过使用服务器端图像生成来做到这一点，
<img src="handler.ashx?text=bla&fg=FFFFFF&bg=000000" />
不幸的是，这会禁用使用 搜索文本CTRL + F，这是相当不幸的，因为有很多组（数百个）。

现在有一些关于 SO 的帖子，例如将
HTML SVG 文本旋转 270 度
如何在 TH 表标签中使用 CSS Rotate()
使用 CSS 转换旋转表格标题文本
https://jsfiddle.net/t5GgE/1/

但是它们要么明确地（或间接地）设置高度，要么在表格标题中使用背景颜色无法正常工作。

现在我到目前为止是这样的：https :
//jsfiddle.net/kn46f38n/6/

其中的问题是垂直对齐底部无法正常工作，并且高度不会自动调整（除非我添加画布图像）。

所有这些都相当令人沮丧，这基本上意味着唯一的进展是用画布替换处理程序，这减轻了服务器的负担，但在可搜索性方面没有任何进展，而且最糟糕的是，使用 JS 进行布局，而有仍然是不支持画布的浏览器。

真的没有办法在 HTML/inlineSVG 中做到这一点，而不必设置显式高度（任何类型的高度，比如包括变换原点），也不必求助于 javascript 吗？

没有 jQuery：

var maxH = 0;
// Find the column label with the tallest height
var hdrs = document.querySelectorAll(".hdr")
for (i = 0; i < hdrs.length; i++)
{
    var bbox …