高效-4css实现前向选择器

如下html结构,想要实现:当有两个item时,隐藏第二个

<div class="item">第1个</div>
<div class="item">第2个</div>

可以使用相邻选择器

.item  + .item{
  display: none;
}

但是要实现:当有两个item时,隐藏第一个,只有一个item时不隐藏第一个。
由于css没有前向选择器,所以需要用nth-last-type实现

.item:nth-of-type(1):nth-last-of-type(2){
  display: none;
}
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 一:在制作一个Web应用或Web站点的过程中,你是如何考虑他的UI、安全性、高性能、SEO、可维护性以及技术因素的...
    Arno_z阅读 1,277评论 0 1
  • CSS 是什么 css(Cascading Style Sheets),层叠样式表,选择器{属性:值;属性:值}h...
    崔敏嫣阅读 1,523评论 0 5
  • (1). 阴影模糊半径与阴影扩展半径的区别:阴影模糊半径:此参数可选,其值只能是为正值,如果其值为0时,表示阴影不...
    Leisure_blogs阅读 1,570评论 0 6
  • 其实平时用得多的选择器无非也就是那么几个,时间久了,许多不常用的选择器就慢慢忘记了。为了不让自己忘记这些选择器,今...
    盛夏晚清风阅读 1,888评论 0 5
  • 三十秒法则 7月15日(周六),早上6点从家里出发,前往澳门聆听王淑芳博士的《母乳喂哺认知工作坊》,全场无尿点的讲...
    小纯说阅读 177评论 0 0