这很奇怪。这是代码:
nav {
position:relative;
}
ul.navul {
padding:0;
margin:0;
background-color:rgba(12,11,11,0.9);
}
.navul li {
list-style-type:none;
display:inline-block;
border-left:1px solid white;
}
.navul li:first-child {
border-left:none;
}
.navul a {
display:inline-block;
padding:10px;
margin:0px;
text-decoration:none;
color:#fff;
border:1px solid blue;
}
这是我所看到的快照:
小块链接
当我减少'a'标签中的填充时,块的大小会变小,反之亦然。我已经将list-style-type设置为“ none”。我已经尝试在'li'标签上进行padding:0和margin:0,但是似乎没有用。我真的不知道发生了什么。
有人可以帮忙吗?
最佳答案
尝试这个。我删除了蓝色边框,而是在锚点a
标签而不是li
标签周围添加了白色边框
nav {
position:relative;
}
ul.navul {
padding:0;
margin:0;
background-color:rgba(12,11,11,0.9);
}
.navul li {
list-style-type:none;
display:inline-block;
}
.navul a:first-child {
border-left:none;
}
.navul a {
display:inline-block;
padding:10px;
margin:0px;
text-decoration:none;
color:#fff;
border-left:1px solid white;
}