Html 当我仅将样式限制为列表内的锚点时，为什么所有锚点标记都获得样式？

我的页面顶部有一个列表。
列表位于div标记中。
问题是我只需要在类为

的列表中的
中设置一些css样式。问题的底部是菜单社交图标
样式。

但当我像我在下面写的那样添加样式时，页面上的所有
标记都会获得这些样式。

我不知道为什么它会传播到所有链接。

我的CSS样式有问题吗？

这是我的HTML输出：

<div class="full-width top-page-bar">
    <div class="row">
        <div class="large-12 columns">
            <div class="left">
                <ul class="right inline-list menu-social-icons show-for-large-up">                  
                        <li><a href="#" class="fa fa-twitter"></a></li>
                        <li><a href="#" class="fa fa-google-plus"></a></li>
                        <li><a href="#" class="fa fa-facebook"></a></li>
                        <li><a href="#" class="fa fa-linkedin"></a></li>
                        <li><a href="#" class="fa fa-youtube"></a></li>
                </ul>
            </div>

            <div class="right"> 
              <ul class="no-bullet inline-list right account-holder">

                <li><a id="registerLink" title="Register" class="SkinObject" href="#">Register</a>
</li>
                <li><a id="loginLink" title="Login" class="LoginLink" href="#">Login</a>
</li>
              </ul>
            </div>
        </div>
    </div>
</div>

此选择器存在问题：
。菜单社交图标li a，a:link，a.visted，a.active
它正在应用于：链接、访问和活动。您也必须对其进行范围界定，如下所示：

.menu social icons li a、.menu social icons li a:link、.menu social icons li a.visted、.menu social icons li a.active
此选择器存在问题：
。menu social icons li a，a:link，a.visted，a.active
它正在应用于：链接、访问和活动。您也必须对其进行范围界定，如下所示：

.menu social icons li a、.menu social icons li a:link、.menu social icons li a.visted、.menu social icons li a.active
还将.menu social icons添加到剩余的a:link a:visted a.active或将应用于所有

对此

    .menu-social-icons li a, .menu-social-icons li a:link, .menu-social-icons a.visited, a.active {
            border-radius: 50% 50% 50% 50%;
            color: #ff0000;
            display: inline-block;
            font-size: 20px;
            height: 35px;
            line-height: 35px;
            margin: 0 5px;
            padding: 0;
            text-align: center;
            width: 35px;
            background: #f1f1f1;
    }

另外，将.menu社交图标添加到剩余的a:link a:visted a.active或将应用于所有

对此

    .menu-social-icons li a, .menu-social-icons li a:link, .menu-social-icons a.visited, a.active {
            border-radius: 50% 50% 50% 50%;
            color: #ff0000;
            display: inline-block;
            font-size: 20px;
            height: 35px;
            line-height: 35px;
            margin: 0 5px;
            padding: 0;
            text-align: center;
            width: 35px;
            background: #f1f1f1;
    }

你的css声明没有做你认为它是什么。这条线

.menu-social-icons li a, a:link, a.visited, a.active {

将样式应用于
。菜单社交图标LIA
，以及
链接
、
已访问
、或
活动
状态中的任何链接

要解决此问题，您需要使用以下命令：

.menu-social-icons li a, .menu-social-icons li a:link,
.menu-social-icons li a.visited, .menu-social-icons li a.active {

你的css声明没有做你认为它是什么。这条线

.menu-social-icons li a, a:link, a.visited, a.active {

将样式应用于
。菜单社交图标LIA
，以及
链接
、
已访问
、或
活动
状态中的任何链接

要解决此问题，您需要使用以下命令：

.menu-social-icons li a, .menu-social-icons li a:link,
.menu-social-icons li a.visited, .menu-social-icons li a.active {

坏：
。菜单社交图标li a，a：链接，a.访问，a.活动

好：
。菜单社交图标li a、.菜单社交图标li a:链接、.菜单社交图标li a.已访问、.菜单社交图标li a.活动

完整示例：


。菜单社交图标li a、.菜单社交图标li a:链接、.菜单社交图标li a.已访问、.菜单社交图标li a.活动{
边界半径：50%50%50%50%；
颜色：#ff0000；
显示：内联块；
字体大小：20px；
高度：35px；
线高：35px；
利润率：0.5px；
填充：0；
文本对齐：居中；
宽度：35px；
背景#f1f1；
}
.菜单社交图标li a:悬停{
颜色：#fff；
文字装饰：无；
背景：#ff0000；
}














坏：
菜单社交图标li a，a：链接，a.访问，a.活动

好：
。菜单社交图标li a、.菜单社交图标li a:链接、.菜单社交图标li a.已访问、.菜单社交图标li a.活动

完整示例：


。菜单社交图标li a、.菜单社交图标li a:链接、.菜单社交图标li a.已访问、.菜单社交图标li a.活动{
边界半径：50%50%50%50%；
颜色：#ff0000；
显示：内联块；
字体大小：20px；
高度：35px；
线高：35px；
利润率：0.5px；
填充：0；
文本对齐：居中；
宽度：35px；
背景#f1f1；
}
.菜单社交图标li a:悬停{
颜色：#fff；
文字装饰：无；
背景：#ff0000；
}