说起css的content,很多人都知道那就是用来在标签头尾插入内容的,但如果你说css里面的attr和content有啥关系,我想还是蛮多人不知道的吧,attr做前端的应该见名思义是用来操作html属性的,确实,在这里我们依然是用来跟属性相关操作
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>content-attr</title>
<style>
a:after {
content: "("attr(href)")";
}
div:after{
content: attr(abbr);/*不用引号也可以*/
}
img:after{
content: "("attr(title)")";
}
</style>
</head>
<body>
<a href="http://www.szhulian.com">深正互联</a>
<div abbr="我是个属性,你看能获取到吗" title="000">我擦,attr你牛逼了</div>
<img src="http://www.weipxiu.com/wp-content/uploads/2017/08/kulian.png" title="图片" alt="">
<p>图片是单标签,不允许你使用这种伪类</p>
</body>
</html>
深圳 · 龙岗 · 大运软件小镇22栋201
电话:400 182 8580
邮箱:szhulian@qq.com