ul的margin撑不开想要的距离的办法

Posted 好高的一座山

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了ul的margin撑不开想要的距离的办法相关的知识,希望对你有一定的参考价值。

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
  5. <title>test</title>
  6. <style type="text/css">
  7. *{margin:0;
  8.   padding;0;}
  9. span{background:#fdb48c;}
  10. .warp{background:#666;
  11.       border:#000000 1px solid}
  12. .warp ul{display:block; background:#ccc; list-style:none; margin:10px; padding:0px;}
  13. </style>
  14. </head>
  15. <body>
  16. <span> begin begin begin </span>
  17. <div class="warp">
  18.   <ul>
  19.     <li>text text</li>
  20.     <li>text text</li>
  21.     <li>text text</li>
  22.     <li>text text</li>
  23.     <li>text text</li>
  24.   </ul>
  25. </div>
  26. <span> end end end end </span>
  27. </body>
  28. </html>

复制代码
给wrap加上边框可以解决这问题,,不过建议把ul:margin改为wrap:padding,,,更佳

以上是关于ul的margin撑不开想要的距离的办法的主要内容,如果未能解决你的问题,请参考以下文章

css中padding和margin到底是相对于父元素还是子元素?

用ulli做横向导航

用ulli做横向导航

margin-bottom无效问题以及div里内容动态居中样式!

div子元素无法调整

js寻路算法