<!DOCTYPE html>

 <html>

 <head>

 <style>

 div{

   border:1px solid;

 }

 .bb{

   position:absolute;

   width:200px;

   height:20px;

   text-align: center;

   transform: rotate(-90deg);

   transform-origin: 0 0;

   top:50%;

   margin-top:100px;

 }

 .aa{

   position:relative;

   width:20px;

   height:500px;

 }

 </style>

 </head>

 <body>

 <div class="aa">

 <div class="bb"><span>ABCDEFGasdfasfa</span></div>

 </div>

 </body>

 </html>

Transform(变换)—Y轴lable内容旋转的更多相关文章

  1. Android立体旋转动画实现与封装（支持以X、Y、Z三个轴为轴心旋转）

    本文主要介绍Android立体旋转动画,或者3D旋转,下图是我自己实现的一个界面 立体旋转分为以下三种: 1. 以X轴为轴心旋转 2. 以Y轴为轴心旋转 3. 以Z轴为轴心旋转--这种等价于andro ...

  2. 好吧，CSS3 3D transform变换，不过如此！

    一.写在前面的秋裤 早在去年的去年,我就大肆介绍了2D transform相关内容.看过海贼王的都知道,带D的家伙都不是好惹的,2D我辈尚可以应付,3D的话,呵呵,估计我等早就在千里之外被其霸气震晕了 ...

  3. 好吧，CSS3 3D transform变换，不过如此！——张鑫旭

    一.写在前面的秋裤 早在去年的去年,我就大肆介绍了2D transform相关内容.看过海贼王的都知道,带D的家伙都不是好惹的,2D我辈尚可以应付,3D的话,呵呵,估计我等早就在千里之外被其霸气震晕了 ...

  4. 【C#/WPF】Image图片的Transform变换：平移、缩放、旋转

    WPF中图像控件Image的变换属性Transform: 平移 缩放 旋转 即要想实现图片的平移.缩放.旋转,是修改它所在的Image控件的Transform变换属性. 下面在XAML中定义了Imag ...

  5. android3D动画,绕y轴旋转

    原文地址:http://blog.csdn.net/x_i_a_o_h_a_i/article/details/40449847 其实网上的3D旋转的例子很多,在这里我只是想把其代码做一个解释. 先上 ...

  6. Safari 3D transform变换z-index层级渲染异常的研究

    by zhangxinxu from http://www.zhangxinxu.com/wordpress/?p=5569 一.Safari是新时代的IE6 在2年前介绍currentColor变量 ...

  7. 第98天：CSS3中transform变换详解

    transform变换详解 本文主要介绍变形transform. Transform字面上就是变形,改变的意思.在CSS3中transform主要包括以下几种:旋转rotate.扭曲skew.缩放sc ...

  8. CSS3☞transform变换

    transform CSStransform属性允许你旋转,缩放,倾斜或平移给定元素.这是通过修改CSS视觉格式化模型的坐标空间来实现的. DEMO /* Keyword values */ tran ...

  9. 自己总结的CSS3中transform变换、transition过渡、animation动画的基本用法

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...

随机推荐

  1. 教你快速录制gif动图

    我们经常会遇到一些场景,需要你向别人展示一些操作或是效果——例如告诉别人某某软件的配置步骤啊.刚设计出来网站的动画效果怎么样啊.某某电影里面的一个镜头多么经典啊.打得大快人心的NBA绝杀瞬间是怎么回事 ...

  2. Java学习--枚举

    枚举类型enum,地位等同于class,interface 使用enum定义的枚举类型,也是一种变量类型,可用于声明变量 枚举的一些特征 1．它不能有public的构造函数,这样做可以保证客户代码没有 ...

  3. VUE页面渲染问题

    <!DOCTYPE html> <html> <head> <script src="./vue.min.js"></scri ...

  4. 随想：目标识别中，自适应样本均衡设计，自适应模型结构（参数可变自适应，模型结构自适应，数据类别or分布自适应）

    在现在的机器学习中,很多人都在研究自适应的参数,不需要人工调参,但是仅仅是自动调参就不能根本上解决 ai识别准确度达不到实际生产的要求和落地困难的问题吗?结论可想而知.如果不改变参数,那就得从算法的结 ...

  5. python入门（十五）：装饰器

    1.装饰器(decorator):设计模式 作用:给不同的函数和方法,增加不同的公用的功能. @classmethod,@staticmethod等均是装饰器 定义一个装饰函数,函数必须返回一个闭包函 ...

  6. cuts

    1.cuts .replacename.fasta..replacename.fasta..replacename.fasta.cut.list awk 'system("mv Dme49. ...

  7. PHP 构造方法 __construct()和PHP 析构方法 __destruct()

    PHP 构造方法 __construct() 允许在实例化一个类之前先执行构造方法. 构造方法 构造方法是类中的一个特殊方法.当使用 new 操作符创建一个类的实例时,构造方法将会自动调用,其名称必须 ...

  8. 一起学libcef--搭建自己的libcef运行环境（Win32程序，错误C2220解决方案）

    转自 http://blog.csdn.net/wangshubo1989/article/details/50180413 现在就来讲讲如何在自己的win32程序中搭建libcef运行环境. 首先就 ...

  9. linux应用之test命令详细解析

    test命令用法. 功能:检查文件和比较值 1)判断表达式 if test  (表达式为真) if test !表达式为假 test 表达式1 –a 表达式2                  两个表 ...

  10. python3 BeautifulSoup模块

    一.安装下载: 1.安装: pip install beautifulsoup4 2.可选择安装解析器:pip install lxmlpip install html5lib 3.解析器比较: 解析 ...