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. LINUX动态库(.SO)搜索路径(目录)设置方法

    LINUX动态库(.SO)搜索路径(目录)设置方法 [root@VM_0_11_centos ld.so.conf.d]# cat /etc/ld.so.confinclude ld.so.conf. ...

  2. https://learnku.com/docs/go-blog/qihoo/6532 。 heap size went up to 69G, with maximum garbage collection (GC)

    https://learnku.com/docs/go-blog/qihoo/6532 Use a Task Pool, a mechanism with a group of long-lived ...

  3. 外观模式(Facade) Adapter及Proxy 设计模式之间的关系 flume 云服务商多个sdk的操作 face

    小结: 1. 外观模式/门面模式 Facade  往是多个类或其它程序单元,通过重新组合各类及程序单元,对外提供统一的接口/界面. Proxy(代理)注重在为Client-Subject提供一个访问的 ...

  4. P5518 [MtOI2019]幽灵乐团 / 莫比乌斯反演基础练习题

    瞎扯 建议在阅读题解之前欣赏这首由普莉兹姆利巴姐妹带来的的合奏. Q:你参加省选吗?不是说好了考完 NOIP 就退吗. A:对啊. Q:那你学这玩意干啥? A:对啊,我学这玩意干啥? 写这题的动机? ...

  5. Uniter 单一框架学习

    unittest单元测试框架不仅可以适用于单元测试,还可以适用WEB自动化测试用例的开发与执行,该测试框架可组织执行测试用例,并且提供了丰富的断言方法,判断测试用例是否通过,最终生成测试结果. 一.u ...

  6. Spring|SpringMVC中的注解

    文章目录 一.Spring注解 @Controller @ResuController @Service @Autowired @RequestMapping @RequestParam @Model ...

  7. HttpURLConnection下载文件流

    package com.loan.modules; import sun.net.www.protocol.file.Handler; import java.io.*; import java.ne ...

  8. 浅谈Winform控件开发(一):使用GDI+美化基础窗口

    写在前面: 本系列随笔将作为我对于winform控件开发的心得总结,方便对一些读者在GDI+.winform等技术方面进行一个入门级的讲解,抛砖引玉. 别问为什么不用WPF,为什么不用QT.问就是懒, ...

  9. django开发东京买菜,全栈项目,前端vue,带手机GPS精准定位,带发票系统,带快递系统,带微信/支付宝/花呗/银行卡支付/带手机号一键登陆,等等

    因为博客园不能发视频,所以,完整的视频,开发文档,源码,请向博主索取 完整视频+开发文档+源码,duanshuiLu.com下载 vue+django手机购物商城APP,带支付,带GPS精准定位用户, ...

  10. 2019 Multi-University Training Contest 1 A.Blank(dp)

    题意:现在要你构造一个只有{0,1,2,3} 长度为n且有m个限制条件的序列 问你方案数 思路:dp[i][j][k][now]分别表示四个数最后出现的位置 最后可以滚动数组 优化一下空间 ps:我的 ...