如何去除导航栏之间的间距

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>导航栏</title>
    <link rel="stylesheet" type="text/css" href="CSS/mycss11.css">
</head>
<body>
    <ul>
        <li><a href="#" targer="_self" title="JAVA">导航栏1</a></li>
        <li><a href="#" targer="_self" title="XML">导航栏2</a></li>
        <li><a href="#" targer="_self" title="PHP">导航栏3</a></li>
        <li><a href="#" targer="_self" title="HTML">导航栏4</a></li>
    </ul>
</body>
</html>

ul{
    list-style-type:none;
    margin: 0px;
    padding: 0px;
}
li{
    display:inline;
}
a:link,a:visited{
    width:70px;
    color: black;
    background-color: mistyrose;
    text-decoration: none;
    text-align: center;
    padding:4px;
}
a:hover,a:active{
    background-color: red;
}

用的display:inline;方法制作的导航栏，但之间为什么会有点间距，怎么去除？除了加背景颜色还有什么方法？

三咚

浏览 2443回答 6

6回答

紫焰123

方法一：<li><a href="#" targer="_self" title="JAVA">导航栏1</a></li><li><a href="#" targer="_self" title="XML">导航栏2</a></li><li><a href="#" targer="_self" title="PHP">导航栏3</a></li><li><a href="#" targer="_self" title="HTML">导航栏4</a></li>方法二：li{float:left}

0 0

初级码农

display:block;

0 0

花舞街

也可以在ul里用font-size:0;

0 0

echo_kinchao

内联会计元素你代码换行的话会有额外增加的空白宽度

0 0

慕虎4776435

css初始化

0 0

随时随地看视频慕课网APP