0

我正在使用下面的代码来查看产品 ID。为每个列表使用背景图像。我想把图像放在前面，把文字放在后面。

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
.addcart
{

}
 .addcart ul{
     list-style:none;
        }
 .addcart li{
     list-style:none;
          background-image:url(round.png);
            background-repeat: no-repeat;
            height:45px;
            top:0px;
        }
        .addcart h3
        {
            font-size:24px; 
            font-weight:bold;
            padding:10px 0px 40px 10px; 
            color:#F00;
            z-index:400px;  
            position:relative;
        }
</style>
</head>

<body>
<ul class="addcart">
<li><span><h3>96</h3></span></li>
<li><h3>97</h3></li>
</ul>

</body>
</html>
4

5 回答 5

1

如果您只想隐藏文本，请执行以下操作：

.addcart h3 {
    position : absolute;
    left     : -9999px;
}

演示：http: //jsfiddle.net/PFMHr/

于 2013-02-06T06:11:38.887 回答
1

你想让文本返回吗？我可以建议你隐藏它而不是

display:none;

如果这对您的工作来说不是一个可行的解决方案，您能详细说明一下功能吗？

于 2013-02-06T06:12:48.140 回答
0

您可以添加 .addcart li 吗？

text-indent:-9999em;

于 2013-02-06T06:11:32.113 回答
0

我想最好的方法是通过 Javascipt 或 jQuery将该文本的显示属性设置为无。不需要寄回去。或者你有什么特别的理由把它寄回去？

于 2013-02-06T06:25:11.413 回答
0

z-index 不是以像素为单位的属性，它应该是

z-index: 400;

另外，以这种方式使用 h3 不是最佳选择，我会使用 span 代替；无论如何，您正在增加字体大小，因此您无需为此在 h3 上进行中继。

于 2013-02-06T06:39:52.867 回答