css3"::之后"伪元素不起作用 [英] css3 "::after" pseudo-element not working
本文介绍了css3"::之后"伪元素不起作用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我想在div标签后添加一个三角形,因此我在伪元素之后使用了css3.但这不起作用.以下是我的CSS规则.
I want to add a triangle after a div tag.Therefore i used css3 after pseudo-element. But it's not working. Following is my css rule.
.header-wrapper .part1 ::after {
width: 0;
height: 0;
border-left: solid 48.35px #f21e1e;
border-bottom: solid 48.35px transparent;
border-top: solid 48.35px transparent;
}
以下是我的html部分
Following is my html part
<div class="header-wrapper">
<div class="part1"></div>
</div>
推荐答案
要生成伪元素,您需要(示例)
In order for the pseudo element to be generated, you need to specify a content
value. The value is otherwise assumed to be the default, none
- which is likely why it isn't working in your case. (example)
.header-wrapper .part1::after {
content: '';
width: 0;
height: 0;
border-left: solid 48.35px #f21e1e;
border-bottom: solid 48.35px transparent;
border-top: solid 48.35px transparent;
}
根据发布的CSS,还应该删除.part1 ::after
之间的空格.
Based on the CSS you posted, you should also remove the space between .part1 ::after
.
这篇关于css3"::之后"伪元素不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文