HTML vertical text (Safari, Firefox, Chrome, and Opera)


.vText {
-moz-transform: rotate(-90deg) translate(0, 100%);
-moz-transform-origin: 0% 100%;
-o-transform: rotate(-90deg) translate(0, 100%);
-o-transform-origin: 0% 100%;
-webkit-transform: rotate(-90deg) translate(0, 100%);
-webkit-transform-origin: 0% 100%;
transform: rotate(-90deg) translate(0, 100%);
transform-origin: 0% 100%;
} IE:
.zx {writing-mode:bt-lr; } 在IE和firefox等不同浏览器中的效果不一样,用法也不一样。 Ref
http://brickybox.com/2010/09/15/html-vertical-text-safari-firefox-chrome-and-opera
http://generatedcontent.org/post/45384206019/writing-modes
http://stackoverflow.com/questions/5524799/how-do-you-do-vertical-text-in-firefox

HTML文本/文字竖直方向/纵向显示的更多相关文章

  1. android中自定义view---实现竖直方向的文字功能,文字方向朝上,同时提供接口,判断当前touch的是哪个字符,并改变颜色

    android自定义view,实现竖直方向的文字功能,文字方向朝上,同时提供接口,判断当前touch的是哪个字符,并改变颜色. 由于时间比较仓促,因此没有对代码进行过多的优化,功能远远不如androi ...

  2. writing-mode,文字竖直书写,字符之间距离,单词之间距离

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  3. HTML中行内元素的竖直方向的padding和margin是否真的无效

    参考资料:Inline elements and padding 今天写一个导航栏时遇到了一个问题:行内元素的padding-top,padding-bottom和margin-top,margin- ...

  4. Android camera 竖直拍照 获取竖直方向照片

    竖直拍照 if (Integer.parseInt(Build.VERSION.SDK) >= 8) {     camera.setDisplayOrientation(90); } else ...

  5. html的a标签display:block之后文字竖直居中

    设置行高和a标签的高度一样就能居中,使用line-height

  6. CSS -- 文字竖直居中

    元素的height 和 lineheight 设置为一样即可.

  7. 三个css属性 设置文字竖直居中

    display: flex; justify-content:center; align-items:Center;

  8. 设置UIScrollView只可以水平或者竖直滚动

    UIScrollView里边包含多个UIWebView: 可以通过设置contentSize的值,设置其width为UIScrollerView可视区域的宽度:即UIScrollView的width, ...

  9. QML学习笔记(四)-TabView-竖直方向

    源码:https://github.com/sueRimn/QML-ExampleDemos 作者: 狐狸家的鱼 Github: 八至 版权声明:如需转载请获取授权和联系作者 想实现垂直竖直方向的Ta ...

随机推荐

  1. 借助EasyNTS云组网,无需拉专线,也能解决设备现场无公网固定IP的问题

    一.产品背景 为了帮助企业和个人用户解决网络访问和设备控制的问题,我们研发了一款创新型产品:EasyNTS云组网系统.什么是EasyNTS,什么是云组网呢? 在解释之前,我们先来了解几个在凡是涉及网络 ...

  2. pycharm如何自定义模板?

    按照上图箭头方向设置即可.

  3. 【Python之路】第十三篇--DOM

    文档对象模型(Document Object Model,DOM)是一种用于HTML和XML文档的编程接口.它给文档提供了一种结构化的表示方法,可以改变文档的内容和呈现方式.我们最为关心的是,DOM把 ...

  4. OC中nil、Nil、NULL、NSNull的区别

    nil:指向OC中对象的空指针 e.g.: NSString *string = nil; Nil:指向OC中类的空指针    e.g.:Class class = Nil; NULL:指向其他类型的 ...

  5. iOS 关于多线程的一些基本概念

    一 什么是进程 进程是在系统中正在运行的应用程序!普通的应用程序并不是进程,只有正在运行的应用程序才是一个进程, 在系统中每个进程之间是相互独立的,每个进程均在其专享的且受保护的内存空间内.但是一个应 ...

  6. Difference between .classpath and MANIFEST.MF

    What is the difference between adding a dependency jar to the .classpath file in a RAD project and a ...

  7. XE2安装JVCL

    XE2安装JVCL1. 下载:要分别下载JCL和JVCL安装包,不可以图省事不下载前者.http://sourceforge.net/projects/jcl/files/JCL%20Releases ...

  8. CentOS 7.4系统优化/安装软件

    源改为国内源 阿里云yum源 https://opsx.alibaba.com/mirror 清华yum源 https://mirrors.tuna.tsinghua.edu.cn/ 网易163yum ...

  9. Python3.6全栈开发实例[008]

    8.有如下变量(tu是个元祖),请实现要求的功能:tu = ("alex", [11, 22, {"k1": 'v1', "k2": [&q ...

  10. 常用模块一(random模块、time模块、sys模块)

    一.random模块 import random # 1 取随机小数 应用:数学计算 ret = random.random() # 大于0且小于1之间的小数 print(ret) # 0.53559 ...