如何删除导航栏上方和两侧的空间？
如何删除导航栏上方和两侧的空间？
提问于 2017-08-14 10:03:47
我正在学习HTML&CSS，我想知道如何删除导航bar.The导航栏的上方和侧面的空间，这样的话，it.Below周围就没有空间了。
nav{
text-align:right;
padding-right:0px;
padding-top:0px;
}
ul{
color:white;
background-color:cyan;
padding-top:19px;
padding-bottom:19px;
padding-right:10px;
list-style:none;
margin-top:none;
}
.sb{
float:left;
}<!DOCTYPE html>
<html>
<head>
<title>My first css program</title>
</head>
<body>
<nav>
<ul>
<li>
<div class="sb">
<input type="text" name="search">
<input type="submit" name="search" value="search">
</div>
<a href="www.az.com">Home |</a>
<a href="www.az.com/profile">Profile |</a>
<a href="www.az.com/settings">Settings</a>
</li></ul>
</nav>
</body>
</html>
回答 8
Stack Overflow用户
回答已采纳
发布于 2017-08-14 10:29:28
你想让肚脐没有空白处。所以我拿了你的代码做了一些修改。
首先是HTML，我删除了您的<nav>和<ul>，然后用<div>替换了这些部分。
代码：
<body>
<div class="div">
<div class="sb">
<input type="text" name="search">
<input type="submit" name="search" value="search">
</div>
<div class="link">
<a href="www.az.com">Home |</a>
<a href="www.az.com/profile">Profile |</a>
<a href="www.az.com/settings">Settings</a>
</div>
</div>
</body>在此之后，我获取了您的CSS并对其进行了修改，以适应您所做的查询。
代码：
.link{
margin-left:80%
}
.div{
color:white;
background-color:cyan;
padding-top:19px;
padding-bottom:19px;
padding-right:10px;
height:10%;
}
.sb{
float:left;
margin-left: 2%;
}
body,html{
margin: 0;
padding: 0;
border: 0;
}工作小提琴这里
现在，您的肚脐没有任何空白向上，或右或左。现在，这取决于你的修补，以满足你的需要。
Stack Overflow用户
发布于 2017-08-14 10:14:23
我想，你在找这个？
nav{
text-align:right;
padding-right:0px;
padding-top:0px;
}
ul{
color:white;
background-color:cyan;
padding-top:15px;
padding-bottom:19px;
padding-right:10px;
list-style:none;
margin:0px;
}
.sb{
float:left;
}
body{
margin: 0px
}<!DOCTYPE html>
<html>
<head>
<title>My first css program</title>
</head>
<body>
<nav>
<ul>
<li>
<div class="sb">
<input type="text" name="search">
<input type="submit" name="search" value="search">
</div>
<a href="www.az.com">Home |</a>
<a href="www.az.com/profile">Profile |</a>
<a href="www.az.com/settings">Settings</a>
</li></ul>
</nav>
</body>
</html>
Stack Overflow用户
发布于 2017-08-14 10:07:42
<!DOCTYPE html>
<html>
<head>
<title>My first css program</title>
<style>
html,body{
margin:0;
padding:0;
}
nav{
text-align:right;
padding-right:0px;
padding-top:0px;
}
ul{
color:white;
background-color:cyan;
padding-top:19px;
padding-bottom:19px;
padding-right:10px;
list-style:none;
margin-top:0;
}
.sb{
float:left;
}
</style>
</head>
<body>
<nav>
<ul>
<li>
<div class="sb">
<input type="text" name="search">
<input type="submit" name="search" value="search">
</div>
<a href="www.az.com">Home |</a>
<a href="www.az.com/profile">Profile |</a>
<a href="www.az.com/settings">Settings</a>
</li></ul>
</nav>
</body>
</html>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/45672060
复制相关文章
相似问题
腾讯云开发者
