我有一个包含一些垂直文本的 HTML 页面。一切都很好,直到我在 IE11 中查看它 - 然后垂直文本不再是垂直的。“该死,我不应该搞砸设计师的原版,在 IE 中渲染还可以”我想。但事实证明,设计师的原始渲染在他们的服务器上正常,但在需要托管的服务器上却不行。我已将问题归结为以下几点:
#vertical_text {
white-space: pre;
display: block;
height: 100%;
width: 100%;
color:blue;
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-ms-transform: rotate(90deg);
-o-transform: rotate(90deg);
transform: rotate(90deg);
}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<meta charset="windows-1252" />
</head>
<body>
<table><tr><td>ABC</td><td><div id="vertical_text">DEF</div></td></tr></table>
</body>
这在 FF、Chrome、Edge 以及当我在 IE 中将其加载为 file:/// 时效果很好。但是当我使用 IE 从我们的 IIS 服务器或 Apache 服务器查看它时,垂直文本不再是垂直的。设计者的服务器是基于 LINUX 的,我们是一个 Windows 站点,这表明存在编码问题,但如果是,我会不知道该怎么办。我尝试在 windows-1252 和 utf-8 之间更改字符集元标记,但没有区别。我已经尝试了此处给出的 IE 中垂直文本的各种替代方案
但它们都不起作用。有任何想法吗?