less &进行选择判断css的样式

先说&在less写 

.parent{
    .child{}
    &.and{}            
}
在css就是

.parent.child{}//父子关系

.parent.and{}//并关系 

用到这个方法是因为用到一个单选按钮有默认选中事件，但是因为按钮是使用了图片来切换选中状态，所以就是我能想到的就是在css里进行切换

.rad_bac{
     margin: 30px auto;
     width: 80px;
     height: 80px;
     background-size:100% 100%;   
     &.onmethod{
        .all{
           display: none;
            }
        .allon{
           display: block;
            }
     } 
      .allon{
           display: none; 
      }  
}

在html

//默认选中的按钮
<div class="rad_bac onmethod">
     <div class="rad_bac all"></div>
     <div class="rad_bac allon"></div>
</div>
//待选择的按钮

<div class="rad_bac">
     <div class="rad_bac all"></div>
     <div class="rad_bac allon"></div>
</div>

一个按钮，上面的onmethod 是选中状态的方法，里面有两种状态的div都写在这个按钮div中，

allon是选中的时候的状态，一开始是选中的隐藏，没选的出现，此时大家都是没有点击的状态，当 按钮和选中的方法同时出现时 没选中的div显示，选中的div隐藏

所以相当于是一个if方法，当某种情况出现时，有不同的展示