第n种类型。CSS选择器 /*顶部导航和底部导航*/ #托普纳夫{ 列表样式类型：无； 文本对齐：左对齐； 保证金：0； 左侧填充：0； 填充：0； } #李托普纳夫{ 列表样式类型：无； 显示：内联； 保证金：0； 填充：0； } #托普纳夫利乌尔{ 显示：内联； 填充：0； } #topnav.菜单李a { 颜色：白色； //背景色：红色； 显示：块； 浮动：左； 高度：31px； 颜色：白色； 宽度：125px； 文字装饰：无； 字体：15px arial粗体； 字体：斜体； 线高：40px； 右边框：1px纯黑； 文本对齐：居中； } #topnav a:第n个类型（7） { 颜色：红色； }

我的意图是在菜单中选择第7个a元素，并将字体颜色更改为红色。什么也没发生，所有的文字都是白色的。是否有办法更改CSS，使包含“Specials”内容的a元素以红色文本显示

感谢您发布…

试试看

                <style>
            /* topnav and footer nav */
                #topnav ul{
                    list-style-type: none; 
                    text-align: left;
                    margin: 0;
                    padding-left: 0;
                    padding: 0;
                }
                #topnav li{
                    list-style-type: none; 
                    display: inline;
                    margin: 0;
                    padding: 0;
                }
                #topnav li ul{
                    display: inline;
                    padding: 0;
                }

                #topnav .menu li a
                {
                    color: white;
                    //background-color: red;
                    display: block;
                    float: left;
                    height: 31px;
                    color: white;
                    width: 125px;
                    text-decoration: none;
                    font: 15px arial bold;
                    font-style: italic;
                    line-height: 40px;
                    border-right: 1px solid black;
                    text-align: center;
                }
                #topnav a:nth-of-type(7)
                {
                    color: red;
                }
            </style>
            <div id="topnav" style="height: 36px;">
            <div class="menu-menu-1-container"><ul id="menu-menu-1" class="menu">
            <li id="menu-item-63" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-63">
            <a href=">Home</a></li>
            <li id="menu-item-64" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-64">
            <a href="">About</a></li>
            <li id="menu-item-75" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-75">
            <a href="">Repairs</a></li>
            <li id="menu-item-67" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-67">
            <a href="">Door Openers</a></li>
            <li id="menu-item-74" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-74">
            <a href="">Testimonials</a></li>
            <li id="menu-item-66" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-66">
            <a href="">Contact Us</a></li>
            <li id="menu-item-69" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-69">
            <a href="">Specials</a></li>
            <li id="menu-item-65" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-65">
            <a href="">Blog</a></li>
            </ul>
            </div>  
            </div>

---

相反。

这很有效。我对必须与类型n一起使用的语法感到有点困惑。我喜欢你的例子。谢谢你的发帖。你明白为什么这是有效的，而你的不行吗？否则我可以解释我认为首先必须将li指定为带有冒号和第n个类型说明符的父元素，然后指定元素的类型，以查找第n个类型，在本例中是a。我不确定您是否理解正确，用我的话来说，有一个简短的解释：类型的n的作用域是父元素。您已将

a

标记嵌套在

li

标记中。如果您编写类型（7）的第n个

a:n，则此操作不会生效，因为所有
a
标记都是其范围内的第一个标记（对应的
li
标记），没有一个是第七个。我的解决方案在其范围内选择第七个
li
标记（即
ul
标记），并从第七个
li
标记中选择
a
标记。
#topnav li:nth-of-type(7) a
{
    color: red;
}