您的位置:首页 > Web前端 > CSS

通过js修改css伪类after,before等样式

2017-06-10 17:53 791 查看
<style>
.box:before {
content: "";
display: block;
width: 190px;
position: fixed;
bottom: 0;
top: 0;
z-index: -1;
background-color: #f2f2f2;
border: 1px solid #ccc;
border-width: 0 1px 0 0;
}
</style>


<div class="box"></div>


实现目的:例如要修改before伪类width为300px;

问题所在:由于伪类(after,before)不能通过js添加行间样式style,所以无法修改伪类样式。

解决方法:在元素上新增class,通过css优先级来实现

1、通过$(“.box”).addClass(“pox”);实现
<div class="box pox"></div>


2、在样式表加新增class样式.pox:before{width:300px !improtant;},通过css优先级实现before修改。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: