css3 units & 1 turn

One full circle is 1turn, 180deg === 0.5turn

degrees, gradians, radians, turns

角度，刻度，弧度，转

deg, grad, rad, turn



transform: rotate(45deg);

transform: rotate(3.1416rad);

transform: rotate(-50grad);

transform: rotate(1.75turn);

https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Types

https://developer.mozilla.org/en-US/docs/Web/CSS/angle

https://developer.mozilla.org/en-US/docs/Web/CSS/transform



.activated .card-header .card-header-right-text:nth-last-of-type(1)::after{

  position: absolute;

  top: 2px;

  right: -5px;

  display: block;

  content: "^";

  width: 1px;

  height: 100%;

  color: #ffffff;

  font-size: 23px;

  /* transform: rotate(0.5turn) translateX(-10px); */

  transform: rotate(180deg) translateX(-10px);

  -webkit-transform: rotate(180deg) translateX(-10px);

  -moz-transform: rotate(180deg) translateX(-10px);

  -ms-transform: rotate(180deg) translateX(-10px);

  -o-transform: rotate(180deg) translateX(-10px);

}

https://developer.mozilla.org/en-US/docs/Web/CSS/ratio

https://developer.mozilla.org/en-US/docs/Web/CSS/@media/aspect-ratio

https://developer.mozilla.org/en-US/docs/Web/CSS/gradient

demo

alipay cards

xgqfrms 2012-2020

www.cnblogs.com 发布文章使用：只允许注册用户才可以访问！

css3 units & 1 turn的更多相关文章

  1. CSS3 长度单位

    http://www.w3chtml.com/css3/units/length/vh.html https://www.html.cn/book/css/values/length/vh.htm . ...

  2. 你可能不知道的7个CSS单位

    如果你是一名前端开发工程师,一般px和em使用频率比较高.但是今天本文的重点是介绍一些我们使用很少.甚至么有听说的单位. 一.重温em <style type="text/css&qu ...

  3. Deep Learning in a Nutshell: History and Training

    Deep Learning in a Nutshell: History and Training This series of blog posts aims to provide an intui ...

  4. clean-css

    What is clean-css? Clean-css is a fast and efficient Node.js library for minifying CSS files. Accord ...

  5. [C2P2] Andrew Ng - Machine Learning

    ##Linear Regression with One Variable Linear regression predicts a real-valued output based on an in ...

  6. CSS3入门学习之属性大全手册

    CSS Level 2 经历了 9 年的时间(从 2002 年 8 月到 2011 年 6 月)才达到 Recommendation(推荐) 状态.主要的原因是被一些 secondary featur ...

  7. CSS3 em && rem 详细教程

    1 # mobile css & rem & em & px > 1 rem === 16px 任意浏览器的默认字体高都是 16px, 所有未经调整的浏览器都符合: 1e ...

  8. CSS3与页面布局学习总结（六）——CSS3新特性（阴影、动画、渐变、变形、伪元素等）

    CSS3在CSS2.1的基础上新增加了许多属性,这里选择了较常用的一些功能与大家分享,帮助文档中有很详细的描述,可以在本文的示例中获得帮助文档. 一.阴影 1.1.文字阴影 text-shadow&l ...

  9. CSS3中惊艳的gradient

    以前曾经记录过linear-gradient(线性渐变)和 radial-gradient(径向渐变)的语法. 可以参考<CSS3中border-radius.box-shadow与gradie ...

随机推荐

  1. springboot开启多线程配置

    一.配置线程池参数 @EnableAsync @Configuration public class TaskExecutorConfig { @Bean public TaskExecutor ta ...

  2. Codeforces 1437F Emotional Fishermen(思维，dp)

    题意 给出数列\(a_i\),求排列\(p_i\)的数量满足 \[\frac{a_{p_i}}{max_{j=1}^{i-1}a_{p_j}} \notin (\frac{1}{2},2) \] 思路 ...

  3. Spring听课笔记（专题二）

    第3章 Spring Bean的装配(上) 3-1:配置项及作用域 1.Bean的配置项: -- Id -- Class (这个必须,其他的都可以不配置) -- Scope (作用域) -- Cons ...

  4. Java AQS的原理

    首先可以看:  http://ifeve.com/java-special-troops-aqs/ 再看  <Java并发编程的艺术>第5章 核心:同步器的acquire方法: 首先调用自 ...

  5. Spark练习之Transformation操作开发

    Spark练习之Transformation操作开发 一.map:将集合中的每个元素乘以2 1.1 Java 1.2 Scala 二.filter:过滤出集合中的偶数 2.1 Java 2.2 Sca ...

  6. Centos7 yum 安装 oracle-rdbms-server-11gR2-pre

    Oracleyum官方网站 http://yum.oracle.com/ 一.下载yum源 根据自己需求下载相应的yum源 http://yum.oracle.com/getting-started. ...

  7. 分布式理论 PACELC 了解么？

    PACELC 基于 CAP 理论演进而来. CAP 理论是一个分布式系统中老生常谈的理论了: C(Consistency):一致性,所有节点在同一时间的数据完全一致. A(Availability): ...

  8. impala支持的数据库里的double(float)类型，通过迁移inceptor后，类型的值都变成了null

    impala支持的数据库里的double(float)类型,通过迁移inceptor后,double类型的值都变成了null. 通过查阅日志发现默认将double转换成Decimal(38,10)然而 ...

  9. Spring学习笔记2

    一.什么是AOP 面向切面编程,通过预编译方式和运行期动态代理实现程序功能的统一维护的一种技术.在不影响原来功能代码的基础上,使用动态代理加入自己需要的一些功能(比如权限的验证,事务的控制,日志的记录 ...

  10. Eclipse中配置Junit

    在要使用Junit的project名上,点击properties-->Java Build Path-->Libraries,点击Add Library 选择Junit 选择Junit 4 ...