慕课网4-6 编程练习:jQuery后排兄弟选择器

4-6 编程练习

结合所学的兄弟选择器" ~ "，实现如下图所示效果：

任务

(1)使用兄弟选择器" ~ "将技术语言的背景色变成红色

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

参考代码：

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <h3>必备基础</h3>
    <ul>
        <b>分类</b>
        <li>HTML</li>
        <li>CSS</li>
        <li>JavaScript</li>
        <li>jQuery</li>
    </ul>
    <h3>热门技术</h3>
    <ul>
        <b>分类</b>
        <li>vue.js</li>
        <li>es6</li>
        <li>less/sass</li>
    </ul>
    <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js"></script>
    <script>
        $(document).ready(function() {
           //此处填写代码
           $('b~li').css({'background':'red'});
        });
    </script>
</body>
</html>

 

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