关于css子选择器(待更新)

189 阅读1分钟

1.'>' css3特有的选择器,A>B 表示选择A元素的所有子B元素。

2.:not() 用来匹配不符合一组选择器的元素。由于它的作用是防止特定的元素被选中

3.last-child first-child 选中第一元素和最后一个元素

     .m-button-group{
            display: inline-flex;
            vertical-align: middle;
            > .m-button{
                border-radius:0 ;
                &:not(:first-child){
                    border-left: none;
                }
                &:first-child{
                    border-top-left-radius: var(--button-radius);
                    border-bottom-left-radius: var(--button-radius);
                }
                &:last-child{
                    border-top-right-radius: var(--button-radius);
                    border-bottom-right-radius: var(--button-radius);
                }
            }
        }