天天育儿网,内容丰富有趣,生活中的好帮手!
天天育儿网 > css after html ::after | CSS属性参考

css after html ::after | CSS属性参考

时间:2020-12-26 23:58:38

相关推荐

css after html ::after | CSS属性参考

CSS ::after伪元素用于在被选择的元素之后插入由content属性指定的内容。

::after伪元素是一个虚拟元素,它默认是内联元素。它通常配合content属性来一起使用,content属性为该虚拟元素提供内容。

例如,如果你想在一个超链接后面添加一个小图标 ,我们就可以通过::after伪元素来实现。

这是一个超链接通过::after伪元素在后面插入了一个图标。

.with_link_icon:after{

content: url(img/link.png);

}

上面的代码将得到下面的结果:

这是一个超链接通过::after伪元素在后面插入了一个图标。

::after伪元素可以插入任何的内容:文字,图片等。例如下面都是有效的内容:

.element::after {

/* 插入一幅图片 */

content: url(path/to/image.png);

}

.element::after {

/* 插入文字 */

content: "(测试文字...)";

}

.element::after {

/* 插入unicode字符 */

content: "\201C";

}

.element::after {

/* 空内容 */

content: "";

}

另外,content中的内容还可以是一

如果觉得《css after html ::after | CSS属性参考》对你有帮助,请点赞、收藏,并留下你的观点哦!

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。