相同的标签，不同的属性 (HTML/CSS)

Question

一个标签可以有不同的属性吗？例如，我有这个：

<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>

还有这个：

<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' 标签设置不同的属性。这个：

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

用于第二批列出的项目，并希望第一批具有不同的属性，因为我不希望图标上的 'margin-left' 太高。谢谢大家，如果您需要我进一步解释或提供更多信息，请告诉我。

Answer 1

在 ul 标签内添加 li 标签..

<ul class="class1">
    <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>

根据这个span标签添加css...

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

Answer 2

已更改

<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>

至

<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>

然后复制 li class 并更改 'margin-left'。谢谢大家

相同的标签，不同的属性 (HTML/CSS)

Same tag, different properties (HTML/CSS)

html

css

html-lists