如何删除此处显示的空格?
嗨,我的代码上有一个CSS Bug,问题显示在图片中。输出一个额外的空间。 我从谷歌复制了这段代码。我浪费了很多时间才找到,但没有什么事情发生。
这是我的HTML代码
<nav>
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Tutorials</a>
<ul>
<li><a href="#">Photoshop</a></li>
<li><a href="#">Illustrator</a></li>
<li><a href="#">Web Design</a>
<ul>
<li><a href="#">HTML</a></li>
<li><a href="#">CSS</a>
<ul>
<li><a href="#">HTML</a></li>
<li><a href="#">HTML</a></li>
<li><a href="#">HTML</a>
<ul>
<li><a href="#">HTML</a></li>
<li><a href="#">HTML</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li><a href="#">Articles</a>
<ul>
<li><a href="#">Web Design</a></li>
<li><a href="#">User Experience</a></li>
</ul>
</li>
<li><a href="#">Inspiration</a></li>
</ul>
</nav>
,CSS是
nav ul ul {
display: none;
}
nav ul li:hover > ul {
display: block;
}
nav ul {
background: #efefef;
list-style: none;
position: relative;
display: inline-table;
}
nav ul li {
float: left;
}
nav ul li a {
display: block; padding:5px;
text-decoration: none;
}
nav ul ul {
position: absolute; top: 100%;
}
nav ul ul li {
float: none;position: relative;
}
nav ul ul ul {
position: absolute; left: 100%; top:0;
}
答案 0 :(得分:1)
答案 1 :(得分:0)
答案 2 :(得分:0)
试试这个
我删除
来自padding:5px;
的 nav ul li a
并添加
padding: 0 10px;
的 nav ul li a