慕课网4-2 编程练习：jQuery祖先后代选择器小案例

4-2 编程练习

结合所学的祖先后代选择器，实现如下图所示效果

任务

(1)使用祖先后代选择器将第二段文字背景色变成红色

(2)使用jQuery的.css()方法设置样式，语法css('属性 '属性值')

参考代码：

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>慕课网4-2 编程练习</title>
</head>
<body>
    <div class="box">
        <ol>
            <li>道终来归正法</li>
            <li>课书聊自限三更</li>
            <li>网中跳出便飞腾</li>
            <li>首身离兮心不惩</li>
            <li>选取灵芝草尽芟</li>
        </ol>
        <ul>
            <li>前望舒使先驱兮</li>
            <li>端端正正人如月</li>
            <li>工夫却是花枝浅</li>
            <li>程文堆案晨兴早</li>
            <li>师尚父年浑未艾</li>
        </ul>
    </div>
    <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js"></script>
    <script>
    $(document).ready(function() {
      //此处填写代码
      $('ul li')
      .css({'background':'red'})
    });
    </script>
</body>
</html>

 

posted @ 2019-06-10 12:09  请叫我二狗哥  阅读(170)  评论(0)    收藏  举报