<!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. ----Androd 系统开机显示白条提示 “there is internal problem with your device， Contact your manufacture ... ”

    ref: https://www.theandroidsoul.com/how-to-fix-theres-an-internal-problem-with-your-device-error-on- ...

  2. Hive学习笔记记录

    典型数据来源: 文件管理服务: FTP文件服务:采用c/s模式,用户可以通过不同的客户端实现文件的上传与下载. NFS文件服务:借助于TCP/IP协议实现网络文件共享 Samba文件服务:是一种在局域 ...

  3. <Dare To Dream>第五次作业：团队项目需求改进与系统设计

    任务1完成情况: a.分析<家教服务管理系统需求规格说明书>初稿的不足: uml建模不完整,无类图.流程图,仅有的用例图也不规范. b.功能分析的四个象限: c. 团队项目的WBS: d. ...

  4. CCNA学习视频

    CCNA:链接:https://pan.baidu.com/s/1aiZC4pbYIu9qJSWcVfKwWw 提取码请私信楼主

  5. 需要转义的java字符（转）

    特别字符 说明 $ 匹配输入字符串的结尾位置.如果设置了 RegExp 对象的 Multiline 属性,则 $ 也匹配 ‘\n' 或‘\r'.要匹配 $ 字符本身,请使用 \$. ( ) 标记一个子 ...

  6. C语言典型编程1

    关于C的一些小而精的编程,适合希望提升编程能力的初学者学习:关键编程也就几句,但思维可以迁移到其他编程语言.同一问题,算法多种 //阶乘运算(有多种编写方式,编程需要看懂,更要打出来)#include ...

  7. Educational Codeforces Round 30 D. Merge Sort

    题意:给你n和k,n代表有多少个数,k代表几次操作,求一个1到n的序列,要k次mergesort操作才能还原 Examples Input 3 3 Output 2 1 3 Input 4 1 Out ...

  8. map基本方法

    添加功能: V put(K key, V value)  添加和修改 ,添加时返回null,修改时返回被修改的值   Map<String,String> map = new HashMa ...

  9. JVM入门

    面试过程中,问到JVM一脸懵逼,在github看了一些文章,感觉质量不错,整理了一下希望大家不吝赐教. 目前主流的jdk采用解释与编译混合执行的模式,其JIT技术采用分层编译,极大地提升了Java的执 ...

  10. 异步、非阻塞和IO多路复用总结

    Nginx是并发处理框架的代表者,很多后台业务都会放在Nginx容器中运行,以实现高吞吐,而Nginx能够支持高并发也是由于使用了异步非阻塞处理模型,本文将用通俗的话讲解异步.同步.阻塞.非阻塞的区别 ...