作品第一课----网页换肤

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>网页换肤</title>
    <style type="text/css">
    body, html { height: 100%; }
    body { margin:0; }
    li { list-style: none; 10px; height: 10px; border: 3px solid; float: left; border-radius: 50%; margin-left: 10px; }
    div { overflow: hidden; }
    .choice_one { border-color: #75E6D5; }
    .choice_two { border-color: #7063A9; }
    .choice_three { border-color: #CCC41E; }
    
    </style>
    <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
</head>
<body>
    <div>
        <ul>
            <li class="choice_one"></li>
            <li class="choice_two"></li>
            <li class="choice_three"></li>
        </ul>
    </div>
    
    <script>
    $(document).ready(function(){
        $(".choice_one").on("click", function(){
            $(".choice_three").css({"background-color": "#CCC41E", "border-color": "#CCC41E"});
            $(".choice_two").css({"background-color": "#7063A9", "border-color": "#7063A9"});
            $(this).css({"background-color": "#DDD", "border-color":"#000"});
            $('body').css("background-color", "#75E6D5");
        });

        $(".choice_two").on("click", function(){
            $(".choice_one").css({"background-color": "#75E6D5", "border-color": "#75E6D5"});
            $(".choice_three").css({"background-color": "#CCC41E","border-color": "#CCC41E"});
            $(this).css({"background-color": "#DDD", "border-color":"#000"});
            $('body').css("background-color", "#7063A9");
        });

        $(".choice_three").on("click", function(){
            $(".choice_one").css({"background-color": "#75E6D5", "border-color": "#75E6D5"});
            $(".choice_two").css({"background-color": "#7063A9", "border-color": "#7063A9"});
            $(this).css({"background-color": "#DDD", "border-color":"#000"});
            $('body').css("background-color", "#CCC41E");
        });
    })

    


    </script>
</body>
</html>

相关阅读:
Linux中split大文件分割和cat合并文件
linux 之oracle静默安装
linux查看文件的编码格式的方法 set fileencoding
cat file | while read line的问题
LINUX增加SWAP分区---install_oracle
分布式系统---负载均衡、同步
oracle常用命令
Oracle中三种循环(For、While、Loop)
PRD产品需求文档
App界面交互设计规范

原文地址：https://www.cnblogs.com/samtrybest/p/5071438.html