Question

我还是HTML＆amp; CSS。我遇到了一个我无法弄清楚如何修复的问题。

导航栏上方有一个白色间隙。我有可能做到这一点，所以它附在顶部。

HTML

<div class="navbar">
    <ul style="float:right;list-style-type:none;">
        <li><a href="mailto:enquiry@efc.ac.uk">CONTACT US</a></li>
        <li><a href="#">JOBS</a></li>
        <li><a href="#">NEWS AND EVENTS</a></li>
        <li><a href="#">BUISNESS</a></li>
        <li><a href="#">COURSES</a></li>
        <li><a href="#">ABOUT EPPING FOREST COLLEGE</a></li>
        <li><a href="#">HOME</a></li>
     </ul>
</div>

CSS

.navbar {
    margin-top: 0px;
}
.navbar ul {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    list-style-type: none;
    background-color: #333;
}

.navbar li {
    float: right;
    font-weight: 700;
}

.navbar li a {
    display: block;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}

.navbar li a:hover {
    background-color: #e74c3c;
}

Answer 1

尝试这个css，因为ul。的浏览器默认边距。

.navbar ul {
  margin: 0 auto;
}

Answer 2

浏览器总是有默认的边距和填充，因此您必须在css中执行此操作

body{
margin:0;
padding:0;}

Answer 3

浏览器有一些默认的边距和填充，因此您可以通过输入：

在CSS中撤消它

body{
margin:0;
padding: 0;
}

Answer 4

使用以下代码删除ul

的边距

默认保证金为16px

ul {
  margin:0;
}

<强> WORKING DEMO

Answer 5

试试这个：

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

Answer 6

只需使用保证金：0;内像这样。

EXEC dbo.do_something

Check demo here

Answer 7

你可以做这样的事情

   *{
padding:0;
margin:0;
}

问题是你需要在每个div设置一个边距和填充。

OR

  ul{
margin:0;
padding:0;
}

Answer 8

是的.navbar类的边框顶部在.navbar {border-top : 0px;}

中添加此行

HTML＆amp;导航栏上方的CSS白色间隙

8 个答案: