好得很程序员自学网

<tfoot draggable='sEl'></tfoot>

css利用文档结构给列表添加样式_html/css_WEB-ITnose

最近做项目,客户提出一个需求,让新闻列表的前三个条目加粗显示。由于新闻列表每天都有更新,所以就利用文档结构来给列表添加样式。

下面以一个简单列表为例,让前三列的前景色显示为红色。

首先是列表代码:

                         ul                                 aaaaaa              bbbbbb              cccccc              dddddd              eeeeee              ffffff              gggggg              hhhhhh                 

然后是两种备选方案:

利用伪类选择器first-child

            ul li:first-child{             color: red;           }            ul li:first-child+li{             color: red;           }           ul li:first-child+li+li{             color: red;           }  

利用 相邻兄弟结合符“+”

            ul li{             color: red;           }            ul li + li + li + li{            color: black;           }   

有一点需要注意的是这两种方式IE6都不支持(什么,还要兼容IE6)?(???)?,想兼容IE6就写js吧。

查看更多关于css利用文档结构给列表添加样式_html/css_WEB-ITnose的详细内容...

  阅读:39次