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. Nginx配置代理gRPC的方法

    Nginx配置代理gRPC的方法_nginx_脚本之家 https://www.jb51.net/article/137330.htm

  2. Vue技术点整理-Vuex

    什么是Vuex? 1,Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式.它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化 2,每一个 Vuex ...

  3. PowerQuery合并查询原理

    PowerQuery的合并查询比Excel中的VLOOKUP更加强大,下面对查询的类型做一个梳理, 1.左外部(第一个中的所有行,第二个中的匹配行):用左边表内的所有行去右边找它的匹配项 2.右外部( ...

  4. Linux下部署tp5项目如何隐藏URL中index.php

    找到nginx配置文件,加入以下代码: location / { if (!-e $request_filename){ rewrite ^/(.*)$ /index.php?s=/$1 last; ...

  5. Spring框架相关博文集

    收藏一些干货博文. Spring 多数据源管理源码分析 Spring事务管理详解 Spring源码解析 Spring框架自学之路

  6. linux　shell 判断空字符串的几种方法！

    在书写linux shell 脚本我们经常会遇到,对一个字符串是否为空进行判断,下面我对几种常用的方法进行了一个总结: 1.-z判断 -z string True if the length of s ...

  7. 误删eth1或者 eth0

    不小心把机房,eth1删除了,过2天还演示,折腾一下午.... 首先eth1存在地方是2块./etc/sysconfig/network-scripts/下 /et/sysconfig/network ...

  8. OSPF特殊区域和LSA

    OSPF路由计算优选次序: (1) 直连路由:本路由器发起的LSA 1.2: (2) 区域内路由:O: LSA 1.2: (3) 区域间路由:O IA: LSA 3: (4) 1类外部路由:O E1: ...

  9. PTA 乙 1001

    1001 害死人不偿命的(3n+1)猜想 题目描述 卡拉兹(Callatz)猜想: 对任何一个正整数 n,如果它是偶数,那么把它砍掉一半:如果它是奇数,那么把 (3n+1) 砍掉一半.这样一直反复砍下 ...

  10. Spring学习笔记2

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