CSS之not巧妙使用
CSS之not巧妙使用
煜子平时在写列表的时候,通常用行分隔线,那么在最后一行中,分隔线是不需要的,所以需要删除。我们一般的写法是普通的,如果使用not来解决呢,大大减少了CSS代码,也能实现效果。请看下面
:not 的使用
列表分割线,去掉最后一行分割线,使用:not解决,使css简单又方便
普通写法
- .list li {
- border-bottom: 1px solid #eee;
- margin: .5rem;
- padding: .5rem;
- }
- .list li:last-of-type {
- border-bottom: 0px;
- }
简单写法
- .list li:not(:last-of-type) {
- border-bottom: 1px solid #eee;
- margin: .5rem;
- padding: .5rem;
- }
全部评论 0
抢沙发