web实训知识点0326

导航栏二级菜单的实现
web实训知识点0326
实现代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style type="text/css">
        *{margin: 0;padding: 0;}
        #nav{ background-color: #50bdba; width:600px; height: 20px;margin: 0 auto;}
        ul li{list-style: none;float: left;line-height: 20px;text-align: center;position: relative;}
        a {text-decoration: none;color: #000000;padding: 0 20px;width: 100px;}
        a:hover{background-color: #50bdba;color: #eaf5fa;}
        ul li ul{position: absolute;top: 20px;left: 0px}
        ul li ul li{float: none;width: 100px;background-color: #50bdba;margin: 1px 0;display: none;}
        ul li ul li a{padding: 0;}
        ul li:hover li{display: block;}
        </style>
<body>
<ul id="nav">
    <ul>
        <li><a herf="#">首页</a></li>
        <li><a herf="#">课堂大厅</a>
        <ul>
            <li><a href="#">web网页实战</a></li>
            <ul>
                <li><a herf="#">web1</a></li>
                <li><a herf="#">web2</a></li>
            </ul>
            <li><a href="#">服务端技术</a></li>
            <li><a href="#">pyhon开发</a></li>
        </ul>
        </li>
        <li><a herf="#">学习中心</a></li>
        <li><a herf="#">经典案例</a></li>
        <li><a herf="#">关于我们</a></li>
        </ul>
</body>
</html>

jQuery学习
特点：快速获取文档元素，提供漂亮的页面动态效果，创建AJAX无刷新网页

jQuery基础语法：
jQuery的选择机构基于css的选，他提供了快速查询DOM文档中元素的能力，而且大大强化了js中获取页面元素的方式，是为HTML元素的选取编制的，可以对元素执行某些操作。

$(selector).action()

1.美元符号定义 jQuery
2.选择符（selector）“查询”和“查找” HTML 元素
3.jQuery 的 action() 执行对元素的操作

相关推荐