第一个列表项的CSS选择器 [英] css selector for first list item

问题描述

我具有以下html结构.

I have the following html structure.

<ul>
  <script id="agendaTmpl" type="text/x-jquery-tmpl">
               <li class="arrow boundElement" style="height:40px;" onclick="GoToPage('session.html?session_id=${agenda_id}');">

                </li>
    </script>
 <li class="arrow boundElement" style="height:40px;" onclick="GoToPage('session.html?     session_id=2');"> test</li>
 <li class="arrow boundElement" style="height:40px;" onclick="GoToPage('session.html?     session_id=2');"> test</li>
</ul>

我需要将类应用于列表的第一个li. 脚本标签无法删除，因为它是该结构的模板. 我尝试了ul > li:first-child，但是它不起作用.仅当li是ul的第一个孩子时，即在没有script标记的情况下，它才有效.

I need to apply class to the first li of the list. The script tag cannot be removed, coz it is a template for the structure. I tried with ul > li:first-child but it is not working. It works only if the li is the first child of the ul, i.e. if the script tag is not present.

请向我建议一种将样式应用于ul的第一手的方法.

Please suggest me a way to apply style to the first li of the ul.

注意:我不允许在第一个li中添加新类.

Note: I am not allowed to add a new class to the first li.

推荐答案

尝试使用first-of-type代替:

ul > li:first-of-type

这是CSS3选择器-因此，旧版浏览器不完全支持该选择器.请参阅@Boltclock的答案以获得更好的跨浏览器支持

This is a CSS3 selector - so is not completely supported across older browsers. See @Boltclock's answer for much better cross-browser support

这篇关于第一个列表项的CSS选择器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！