为什么我给另外一个div下面的dt设置的border,这个div整个都有border?还有为什么我给的最后的float不显示

HTML:

<div class="w-1200">
   <div id="toulan">
       <dl>
           <dt><img src="../shijian.jpg" alt=""/></dt>
           <dd>sjhakhbcjaaj</dd>
           <dd>sjhakhbcjaaj</dd>
           <dd>sjhakhbcjaaj</dd>
           <dd>sjhakhbcjaaj</dd>
           <dd>sjhakhbcjaaj</dd>
           <dd>sjhakhbcjaaj</dd>
       </dl>
   </div>
   <div id="fenlantiao">
      <dl>
           <dt>
           <ul>
               <li>jajjsjsjjsjsjajjs</li>
               <li>jajjsjsjjsjsjajjs</li>
               <li>jajjsjsjjsjsjajjs</li>
               <li>jajjsjsjjsjsjajjs</li>
               <li>jajjsjsjjsjsjajjs</li>
               <li>jajjsjsjjsjsjajjs</li>
           </ul></dt>
           <dd>
                   <img src="../shijian.jpg" alt=""/>
                       <img src="../shijian.jpg" alt=""/>
                   <p>akdkajdkasjdkajsdaskdjaskjdksjdkasjdkasjkdjaksjdskajdkasjdkasjkjsjjsjsjhjsjsjsjjs
               jsjsjsjjsjsjsjjsjsjjjsdjaskdjakjdkadjkajdkajdjasdjasjdajdachwa</p>
               </dd>
       </dl>
   </div>
   <div id="huanlan">
       <dl>
           <dt><img src="../shijian.jpg" alt=""/></dt>
           <dd><p>sjsjsjjssssssssssssssssssssssssssssssssssssssssssssssssssssssddddddddddddddsssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssj</p></dd>
       </dl>
       <dl>
           <dt><img src="../shijian.jpg" alt=""/></dt>
           <dd><p>sjsjsjjssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssddddddddddddddsssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssj</p></dd>
       </dl>
       <dl>
           <dt><img src="../shijian.jpg" alt=""/></dt>
           <dd><p>sjsjsjjsssssssssssssssssssssssssssssssssssssssssssssdddddddddddddssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssj</p></dd>
       </dl>
       <dl>
           <dt><img src="../shijian.jpg" alt=""/></dt>
           <dd><p>sjsjsjjsssssssssssssssssssssssssssssssssssssssddddddddddddssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssj</p></dd>
       </dl>
       <dl>
           <dt><img src="../shijian.jpg" alt=""/></dt>
           <dd><p>sjsjsjjsssssssssssssssssssssssssssssssssssssddddddddddddddddddssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssj</p></dd>
       </dl>
       <dl>
           <dt><img src="../shijian.jpg" alt=""/></dt>
           <dd><p>sjsjsjjssssssssssssssssssssssssssssssssssssssssddddddddddsssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssj</p></dd>
       </dl>
   </div>
</div>

css:

body{
   margin: 0 auto;
   font-family: "微软雅黑", arial, "宋体";
   font-size:20px;
}
*{
   list-style: none;
   padding: 0;
   margin: 0;
}
.w-1200{
   width: 1200px;
   margin: 0 auto;
}
#toulan{
   margin: 5px 0;

}
#toulan dl dd{
   float: left;
  margin: 40px 20px;
}
#toulan dl dt {
  margin: 0 100px 0 15px;
  float: left;
}
#fenlantiao{
   margin: 5px 0;
}
#fenlantiao dl dt ul li {
    padding: 0 5px;
}
#fenlantiao dl dt{
   float: left;
   width: 200px;
}
#fenlantiao dl dd {
   float: left;
   width: 1000px;
}
p{
   word-break:break-all;
}
#huanlan{
   width: 1200px;
   margin: 5px 0;
}
#huanlan dl dt {
    padding: 25px;
   border: 1px solid black;

}
#huanlan dl dd{
   border: 1px solid black;
   width: 1000px;
}
#huanlan dl dt:nth-child(even){
   float: left;
}
#huanlan dl dd:nth-child(odd){
   float: left;
}
#huanlan dl dt:nth-child(even){
   float: right;
}
#huanlan dl dd:nth-child(odd){
   float: right;
}

qq_积木城池_0
浏览 1681回答 1
1回答
打开App,查看更多内容
随时随地看视频慕课网APP