0

请帮助我使用此代码。

CSS 代码

    #nav, #nav ul
            {
                width:1000px;
                background-color: #F3F3F3;
                margin: 0 auto;

            }


     #nav li
        {
            float: left;
            padding-top:3px;
            height:20px;
            text-align:left;
            text-transform:uppercase; 
            position: relative; 
            display: block;
            font-family: Tahoma;
            font-size: 10px;
            font-weight:bold;
            text-align: left;
            text-decoration: none;
            padding:10px 15px 0 15px;
            background:url(../image/border.png) no-repeat right center;
        }

我有问题

#nav li:hover
    {   

        background: #3EBBEC url(../image/arrow.png) no-repeat left; 
        color: #FFFFFF;
        margin:0 auto;
    }

HTML 代码

<html>
<head>Test Page</head>
<body>
<ul>
<li id="nav">test1</li>
<li id="nav">test2</li>
</ul>
</body>
</html>

总代码如下。在这里,我需要删除文本和图像“箭头”之前的空格。我将如何做?

4

5 回答 5

2
.nav li{
   padding-left: 20px;
}

我刚刚意识到您当前的 css 不正确,这不会对您的 html 生效。你应该使用:

li.nav{
   padding-left: 20px;
}
于 2012-05-08T05:36:36.243 回答
1

替换这个 CSS 看看会发生什么

#nav li:hover
    {   

        background: url("../image/arrow.png") no-repeat scroll 4px 10px #3EBBEC; 
        color: #FFFFFF;
    }
于 2012-05-10T08:30:44.813 回答
0

要删除图像,您必须删除此行

background:url(images/arrow.png) no-repeat left center;

关于你需要这样做的空间:

li {float:right; display:block;}
于 2012-05-08T05:40:22.660 回答
0

下面的代码永远不会工作....

.nav li
{
  padding:0px;
  margin: 0px;
}

.nav li:hover
{
  background:url(images/arrow.png) no-repeat left center;
  text-align:center;
  margin 0 auto;

}

采用,

li.nav
{
  padding:0px;
  margin: 0px;
}

li.nav:hover
{
  background:url(images/arrow.png) no-repeat left center;
  text-align:center;
  margin: 0 auto;
}
于 2012-05-08T05:46:58.163 回答
0

ul 元素也有默认样式,如果你想删除所有的空间,尝试添加这个

ul{
  margin:0px;
  padding:0px;
}
li.nav{
  padding:0px;
  margin: 0px;
}

li.nav:hover{
  background:url(images/arrow.png) no-repeat left center;
  text-align:center;
  margin: 0 auto;
}

你也可能想要这个:

ul{
margin:0px;
padding:0px;
list-style-type: none;
}
于 2012-05-08T05:53:48.090 回答