文章出處

一個巨簡單的坑，記錄一下:
class=index的div沒有padding,margin，但上方迷之懸空。

<head>
    <meta charset="UTF-8">
    <title>About Us</title>
    <style>
        * {
            font-family: 'Microsoft YaHei';
            margin: 0;
            padding: 0;
        }

        .index {
            width: 1279px;
            margin: 0 auto;
        }

        .kvb_index_category_top {
            height: 33px;
            font-size: 18px;
            margin: 22px 22px 20px 40px;
        }

        .kvb_index_category_top > li {
            list-style: none;
            float: left;
            padding: 4px 23px;
        }
    </style>

</head>
<body>
<div class="index">

    <div>
        <!--<div style="overflow:hidden;">-->
        <ul class="kvb_index_category_top">
            <li>Home</li>
            <li>|</li>
            <li>About us</li>
            <li>|</li>
            <li>Product and service</li>
            <li>|</li>
            <li>contact us</li>
            <li>|</li>
            <li>system login</li>
            <li>|</li>
            <li>download</li>
        </ul>
    </div>
</div>
</body>

分析:我把頁面刪的只剩這么點，容易發現問題.最后發現是div子標簽ul設置的margin導致外部div上方溢出。
把margin設置為padding就不會懸空了，或者把div設置成overflow:hidden

文章列表


不含病毒。www.avast.com
arrow
arrow
    全站熱搜
    創作者介紹
    創作者 大師兄 的頭像
    大師兄

    IT工程師數位筆記本

    大師兄 發表在 痞客邦 留言(0) 人氣()

    E-mail轉寄