伪类随着浏览器窗口大小变更，改变宽度（resize）

伪类随着浏览器窗口大小变更，改变宽度（resize），伪类样式的更改

css

.plan_wrapper .plan_com:not(:last-child)::after{
    content:'';
    width:400px;
    height:1px;
    border-bottom:2px dashed #9498b1;
    position:absolute;
    left: 130px;
    top:30px;

}

html

<div class="plan_wrapper ">
       <div class="plan_wrapper ">
              <div class="plan_com plan_com1">@name1</div>
              <div class="plan_com plan_com2 ">@name2</div>
              <div class="plan_com plan_com3 ">@name3</div>
              <div class="plan_com plan_com4  ">@name4</div>
         </div>
</div>

　　

script

<script type="text/javascript">
    $(function(){
        //resize() 当调整浏览器窗口大小时，发生 resize 事件。
        $(window).resize(function(){
        var wid_plan =$(".check_plan").width();
        var wid_com = parseInt((wid_plan - 390) / 3);
        //jquery改变伪类的宽度，用变量代替原来的值
        var appendStr = "<style>.plan_wrapper .plan_com:not(:last-child)::after{width: " + wid_com + "px;}</style>";
        $(".plan_com").append(appendStr);
        })
    })
</script>