最近研究css，总是跑掘金思否看大佬案例，从中发现了一个好玩的东西：通过html自定义属性传参，css伪元素接受这个参数，听起来是不是很酷，原来还可以这样传数据哇！

案例：我们通过data-*自定义属性，给div绑定一个char的属性值为：abc，我们看看css怎么接受

html传递： 

<div class="box" data-char="abc"> 
	abc
</div>

css接受： 

.box::before{content:attr(data-char);display: block;position: absolute;right: 0;bottom: 0;color: red;}

attr？什么玩意？CSS2官方解释：attr() 函数返回选择元素的属性值。

这也是能通过css接受参数的关键了

效果图如下：

html传参，css接受？What 弄啥嘞？-QUI-Notes