1

我只需要使用 . 将样式应用于特定的输入标签E:input:nth-of-type(n)

请看他的jsfiddle:http: //jsfiddle.net/nLK2w/3/

你能指出我这里有什么问题吗?改用有意义 E:nth-of-type(n)吗?

 <div class="snippet-navsetupfieldschosen" style="">
     <h1>xxx</h1><ul>
        <li>
            <input id="regionselection1" type="text" readonly="" name="regionselection1" data-href="regionselection1" class="focusable">
            </li>
        <li>
            <input id="regionselection2" type="text" readonly="" name="regionselection2" data-href="regionselection2" class="focusable">
            </li>
            </ul>
        </div>



.snippet-navsetupfieldschosen ul li input:nth-of-type(1) {
    border-top-left-radius: 30px;
    border-top-right-radius: 30px;
}
4

2 回答 2

3

这不是input你想要的第一个,而是第一个<li>。everyinput是 every 的第一个孩子<li>,因此您的代码会影响您在 html 中的每个输入。

示例:http: //jsfiddle.net/skeurentjes/nLK2w/4/

于 2013-10-15T06:33:46.243 回答
2

在您的情况下,为了确保您的第一个输入被选择为您想要的样式,您需要使li元素具有 a:first-child以确保它理解具有输入的 li 的第一个子元素:nth-of-type(1)(现在它是一)应该被选中。

这是工作演示

CSS 变化:

.snippet-navsetupfieldschosen ul li:first-child input:nth-of-type(1) {
    border-top-left-radius: 30px;
    border-top-right-radius: 30px;
    background:red;
}

希望这可以帮助。

于 2013-10-15T06:39:41.850 回答