首页 > Web开发 > 详细

css 函数

时间:2019-02-17 23:29:31      阅读:209      评论:0      收藏:0      [点我收藏+]

标签:abc   超出范围   bsp   code   规则   attr   strong   获取   属性   

css还有一些强大的函数:

1. calc

可以混合多种单位来计算

div {
    font-size: calc(100vw/5 + 1rem - 100px)
}

 

2. max、min、clamp

max、min选最大/小的那个

clamp() 则是给一个值限定一个范围,超出范围外则使用范围的最大或者最小值。

遗憾的是没有浏览器支持

div{width:max(10% + 20px, 300px);}

 

3.toggle

toggle() 函数在规则选中多于一个元素时生效,它会在几个值之间来回切换,比如我们要让一个列表项的样式圆点和方点间隔出现,可以使用下面代码:

ul { list-style-type: toggle(circle, square); }

 

4.attr

用来获取元素的属性值,目前只能在content处使用

<div data-name="abc" title="123"></div>
div:before {
    content:attr(data-name)" "attr(title);
}

 

css 函数

标签:abc   超出范围   bsp   code   规则   attr   strong   获取   属性   

原文:https://www.cnblogs.com/amiezhang/p/10393079.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 bubuko.com 版权所有 鲁ICP备09046678号-4
打开技术之扣,分享程序人生!
             

鲁公网安备 37021202000002号