Question

父元素设置4个div隐藏后再子元素设置一个不隐藏

.bod div{
width: 240px;
height:220px;
float: left;
padding: 20px 20px 20px 20px;
display: none;
}

.def {
display: block;
}
<div class="bod">
<div class="def">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</div>
<div >bbbbb</div>
<div >ccccc</div>
<div >ddddd</div>
</div>

我是想后三个隐藏 第一个不隐藏 然后在父元素直接把div都隐藏 在子元素设不隐藏 为什么都还是隐藏了
我如果要做出这种效果然后又不想一个一个给id的一个一个给style 该怎么弄

Answer 1

这是因为元素选择器（比如div）的优先级（或者说权重）要比类选择器（比如.def）高，所以 .def 始终要被 div 压制。改成这样就OK：
div.def {
display: block;
}

Answer 2

虽然不知道题主这样做的目的，但还是试着回答一下吧：

1. 父div设置隐藏，子div也一定会被隐藏，这是继承性的问题，无法改变，即使你在子div单独设置display：block

2. 第二个问题可以用以下方式来做：

   .bod > div{ display:none} //先设置父div下所有的子div隐藏

   .bod > .def{ display:block} //然后单独设置某一个子div某一个元素的属性

3. 题主可以多了解一下继承性 及 css权重的问题，应该会有所帮助
   

Answer 3

用nth-child()啊。
:nth-child(n+4)选取大于等于4标签
:nth-child(-n+4)选取小于等于4标签