Fatal编程技术网
  • css/
  • CSS选择器-如何针对特定项目

CSS选择器-如何针对特定项目

css

CSS选择器-如何针对特定项目,css,css-selectors,Css,Css Selectors,我正在使用grunticon为每个span带有图标的类嵌入一个不同的svg 我的css选择器有问题： <section class="section"> <div class="padding"> <h2>Title</h2> <ul> <li> <span class="icon svg-icon-1" data-grun

我正在使用grunticon为每个
span
带有
图标的
类嵌入一个不同的svg

我的css选择器有问题：


<section class="section">
    <div class="padding">
        <h2>Title</h2>
        <ul>
            <li>
                <span class="icon svg-icon-1" data-grunticon-embed></span>
                <span class="title">Title 1</span>
            </li>
            <li>
                <span class="icon svg-icon-2" data-grunticon-embed></span>
                <span class="title">Title 2</span>
            </li>
            <li>
                <a href="#">
                    <span class="icon svg-icon-3" data-grunticon-embed></span>
                    <span class="title">Title 3</span>
                </a>
            </li>
        </ul>
    </div>
</section>




标题

    

  • 
标题1

    • 

  • 
标题2

    • 

  • 

    • 




我试过：


。第li节：第n个类型（1）。图标


。第li节：第n个类型（2）。图标


。第li节：第n个类型（3）。图标

但它们是不正确的，并且使用类型为
的第n个具有性能影响。我必须以
.icon
类为目标，不能使用ID。该过程是将每个选择器添加到另一个编码文件，该文件配置为生成SVG


我不知道如何在有限的元素和限制下更加具体。任何指点都很好
 因此，您需要分别针对每个
.icon
元素，但不想/不能使用类型为
n的
。您可以尝试：


.section li .icon.svg-icon-1{}
.section li .icon.svg-icon-2{}


@编辑


。第li节：第n种类型（1）。图标对我很有用。

嗯……也许你可以使用一个id？如果你只需要针对
图标
类，那么简单的选择器
图标
有什么问题？您没有提到任何其他要求。@Roope我已经编辑了原始问题。我想针对每个
图标
类在span标记中生成不同的svg背景。是否要对每个元素应用不同的css？