我忙于 Bigcommerce 网站的设计,发现列表项及其各自背景存在 CSS 语法问题。
列表项标题和列表项本身是从数据库生成的。这是我的代码的样子:
.Left #SideCategoryList ul li:first-child a {
background-image:url("hiddenurl/product_images/uploaded_images/cat-types.png") !important;
padding-left:10px;
padding-top:25px;
}
.Left #SideCategoryList ul li:nth-child(2) a {
background-image:url("hiddenurl/product_images/uploaded_images/cat-collections.png") !important;
padding-left:10px;
padding-top:36px;
}
.Left #SideCategoryList ul li:nth-child(3) a {
background-image:url("hiddenurl/product_images/uploaded_images/cat-themes.png") !important;
padding-left:10px;
padding-top:17px;
}
这些图像完美地显示为我的列表项的标题背景。
然而,这些背景随后被添加到我似乎无法删除的后续 ul 列表项中。
我试图通过以下内容强制后续列表项没有背景:
.Left #SideCategoryList ul li ul li a {
background-image:none !important;
}
但他们仍然不会消失。
你们有什么想法我可以重新编码列表项的背景或强制列表项的其余部分,以便这些背景只出现在“外部”Ul 的列表项标题上?
任何帮助,将不胜感激。
编辑 出于隐私考虑,我正在删除我的网址。完整的 http:\ url 在原始 css 中。
编辑 2为清晰起见,列表结构的布局如下:
<ul>
<li>
<ul>
<li></li>
<li></li>
<li></li>
</ul>
</li>
<li>
<ul>
<li></li>
<li></li>
<li></li>
</ul>
</li>
<ul>
<li></li>
<li></li>
<li></li>
</ul>
</li>
</ul>