html – 无法访问Microsoft Edge中的伪元素

发布时间：2020-12-14 22:39:49 所属栏目：资源来源：网络整理

导读：无法选择或访问以下属性：before ：在Edge`s检查元素之后的元素是否有任何我们可以做的事情？ .arrow_box { position: relative; background: #d43959; border: 4px solid #ac1f3c; width: 300px; height:200px; margin-top:20px;}.arrow_box:after,.arrow_b

无法选择或访问以下属性：before& ：在Edge`s检查元素之后的元素是否有任何我们可以做的事情？

.arrow_box {
    position: relative;
    background: #d43959;
    border: 4px solid #ac1f3c;
    width: 300px;
    height:200px;
    margin-top:20px;
}
.arrow_box:after,.arrow_box:before {
    bottom: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.arrow_box:after {
    border-color: rgba(213,55,0);
    border-bottom-color: #d53737;
    border-width: 20px;
    margin-left: -20px;
}
.arrow_box:before {
    border-color: rgba(245,88,99,0);
    border-bottom-color: #f55863;
    border-width: 26px;
    margin-left: -26px;
}


Codepen link
这个片段工作正常,但在Microsoft边缘我无法访问此伪元素：

.arrow_box:after,.arrow_box:before


最佳答案
@supports规则允许您在Microsoft Edge上处理伪元素.

@supports (-ms-ime-align:auto) {
    .selector {
        property: value;
    }
}


                        （编辑：李大同）
【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!