html5-自定义元素属性data-和content的attr用法


<h2 class="h" data-zj="jy">我是自定义的属性</h2>
h2[data-zj="jy"]{
    color:#FFFF33;}
    
h2[data-zj="jy"]:hover:after{
    content:attr(data-zj);
}

1.data-是自定义属性的写法,后面接你的属性名字如:zj。

2.h2[data-zj="jy"]通过CSS3的属性选择器来定义样式。

3.结合:hover:after这两个伪类:让鼠标悬停在元素上面的时候,在其后面显示出自定义的属性值 :ontent:attr(data-zj);


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM