相同的标签，不同的属性（HTML/CSS）

一个标记是否可能具有不同的属性？例如，我有：

<li><a href="/#"><img src="Images/facebook.png" alt="FaceBook" style="width:25px;height:25px;"></a></li>
<li><a href="/#"><img src="Images/twitter.png" alt="Twitter" style="width:25px;height:25px;"></a></li>
<li><a href="/#"><img src="Images/youtube.png" alt="YouTube" style="width:25px;height:25px;"></a></li>

---

用于第二批列出的项目，并且希望第一批项目具有不同的属性，因为我不希望图标上的“边距”太高。谢谢各位，如果你们需要我进一步解释或提供更多信息，请告诉我。

在ul标签中添加li标签

已更改

到

---

然后复制li类并更改“左边距”。谢谢大家

是的，但是你应该学习如何区分这两个列表。这就是他们的目的，@Paulie_D-没有这样的事。HTML有类，CSS有类选择器。我该怎么做，@Paulie\u D？有很多不同的方法可以做到这一点。它们都可以归结为“编写更具体的选择器”。不要将

li

元素放在span标记中，这不是span的用途！这是可行的，但编程实践很差。您希望编写尽可能少的代码，以便更易于管理和更快地运行。。。您应该做的是将每组

li

元素封装在

ul

之类的东西中，并为每个

ul

指定一个唯一的类。然后，为所有li元素通用的

li

元素编写一些css。然后，为每个

某些类li

编写两个选择器——这将选择该

ul

中的所有

li

元素。这就是你想把你独特的特性放在哪里

<li><a href="/#">Home</a></li>
<li><a href="/#">Roster</a></li>
<li><a href="/#">Store</a></li>
<li><a href="/#">Gallery</a></li>
<li><a href="/#">Our Sponsor</a></li>
<li><a href="/#">About</a></li>

li {
    list-style: none;
    float: left;
    margin-left: 100px;
    padding-top: 25px;
    font-family: Open Sans;
    position: relative;
    color: #000;
    text-decoration: none;
}

<li class="icons"><a href="/#"><img src="Images/facebook.png" alt="FaceBook" style="width:25px;height:25px;"></a></li>
<li class="icons"><a href="/#"><img src="Images/twitter.png" alt="Twitter" style="width:25px;height:25px;"></a></li>
<li class="icons"><a href="/#"><img src="Images/youtube.png" alt="YouTube" style="width:25px;height:25px;"></a></li>