选择第一个DIV以删除其双边框

时间:2014-08-05 17:35:34

标签: html css

您好我试图找到一种方法来跳过(div class =" MyList" )课。我已尝试使用:first-child:first-of-type,但没有运气。基本上,我试图删除第一个Title元素的双边框。非常感谢您的帮助!

HTML

<div class="MyList">   
   <div class="Title">
      <h3></h3> 
   </div>
   <div class="List"></div>
   <div class="List"></div>
   <div class="List"></div>
   <div class="List"></div>
   <div class="Title">
      <h3></h3> 
   </div>
   <div class="List"></div>
   <div class="List"></div>
</div>

CSS

.MyList > :first-child{
   border-top:none;
}

.Title {
    text-align: center; 
    border-left-width:15px; 
    border-bottom-width:5px;
    border-top: 3px solid black;
    padding-top: 1px;
}

.Title:before {
    content: '';
    border-top: 1px solid black;
    display: block;
    width: 100%;
}
.Title  h3 { padding: 20px;}

1 个答案:

答案 0 :(得分:2)

看看这个小提琴:http://jsfiddle.net/j2QLY/

您还需要覆盖要应用于Title元素的:before代码:

.MyList > :first-child {
   border-top:none;
}

.MyList > :first-child:before {
    border-top: none;
}