doudundian9558 2015-07-10 01:12
浏览 32
已采纳

垂直旋转文本的浏览器后备

A designer has requested vertically rotated text such as:

H
e
l
l
o

W
o
r
l
d

The text cannot be an unchangeable image as it might be dynamically changed. The page cannot depend upon JavaScript, and should render reasonably for older browsers.

My first thought was to have PHP create an image from the desired text, and the HTML to access that image. A little complicated, but should be possible.

I have since been told that it is acceptable for older browsers to hide the vertical rotated text.

What is a good fallback for older browser to display vertically rotated text?

  • 写回答

1条回答 默认 最新

  • duanqiao2225 2015-07-10 01:38
    关注

    For newer browsers you can use this CSS:

    .my-text {
        /* prefix as needed; see caniuse.com */
        transform: rotate(90deg);
    }
    

    For older browsers it may be easiest to just hide it, especially if it is not essential to understand the page. If you need that text on the page then just leaving it as normal text would be perfectly fine.

    I suppose you could create images on the server, but the question is if that would be worth the time and effort. Just showing the text as normal text would be much easier... as long as the content is there, exactly how it is presented across browsers is not that important.

    If you look at caniuse.com transform is very well supported. Only IE 8, and Opera Mini, do not support them.

    Opera Mini is a mobile browser where it does not make very much sense to show text vertically anyway, and only about 2% of the world use IE8, most in Asian countries if I am not mistaken. If it was me then I would be happy with about 2% seeing horizontal text; it would not be the end of the world.

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

悬赏问题

  • ¥15 数学的三元一次方程求解
  • ¥20 iqoo11 如何下载安装工程模式
  • ¥15 本题的答案是不是有问题
  • ¥15 关于#r语言#的问题:(svydesign)为什么在一个大的数据集中抽取了一个小数据集
  • ¥15 C++使用Gunplot
  • ¥15 这个电路是如何实现路灯控制器的,原理是什么,怎么求解灯亮起后熄灭的时间如图?
  • ¥15 matlab数字图像处理频率域滤波
  • ¥15 在abaqus做了二维正交切削模型,给刀具添加了超声振动条件后输出切削力为什么比普通切削增大这么多
  • ¥15 ELGamal和paillier计算效率谁快?
  • ¥15 蓝桥杯单片机第十三届第一场,整点继电器吸合,5s后断开出现了问题