Question

我无法摆脱网页上的顶部填充。

HTML：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="style.css">
    <title>Test Page</title>
</head>
<body>
    <div class="textbox">
        <ul>
            <li>Object 1</li>
            <li>Object 2</li>
            <li>Object 3</li>
            <li>Object 4</li>
            <li>Object 5</li>
            <li>Object 6</li>
            <li>Object 7</li>
            <li>Object 8</li>
            <li>Object 9</li>
            <li>Object 10</li>
        </ul>
</body>
</html>

CSS：

html {
    margin: 0;
    padding: 0;
}
body {
    margin: 0;
    padding: 0;
}


.textbox {
    background: red;
    height: 50px;
}


.textbox ul {
    overflow: auto;
}


.textbox li {
    display: inline;
}

当我将其添加到我的代码中时，填充问题会消失，但我不想使用*选择器。

* {
    margin: 0;
    padding: 0;
}

如何在没有通用选择器的情况下摆脱顶部填充？谢谢你的帮助。

Answer 1

将您的保证金0应用于ul

ul {
    margin: 0;
}

您还可以查看http://meyerweb.com/eric/tools/css/reset/它派上用场

http://jsfiddle.net/8vsd2/

Answer 2

ul元素有边距，所以你只需要将其删除，这样就会删除它只针对你所针对的ul。

.textbox ul {
    overflow: auto;
    margin: 0;
}

没有通用选择器无法摆脱顶部填充

2 个答案: