<!DOCTYPE html>
<html lang="zh-CN">
<head> <meta charset="UTF-8"> <meta http-equiv="x-ua-compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>jQuery选择器筛选器练习</title> <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"> <link href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"> <style> .my-padding { padding: 10px 0; } .my-dark { background-color: #f5f5f5; } .footer { background: #111; font-size: 0.9em; position: relative; clear: both; } .my-white { color: #ffffff; } body { margin: 0; } #progress { height: 2px; background-color: #b91f1f; transition: opacity 500ms linear; } #progress.done{ opacity: 0; } </style> </head> <body> <div id="progress"></div> <!--导航栏开始--> <nav class="navbar navbar-inverse my-nav"> <div class="container"> <!-- Brand and toggle get grouped for better mobile display --> <div class="navbar-header"> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="http://www.oldboyedu.com/"><strong>OldBoy Edu</strong></a> </div> <!-- Collect the nav links, forms, and other content for toggling --> <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> <ul class="nav navbar-nav"> <li><a href="#">Python学院<span class="sr-only">(current)</span></a></li> <li><a href="#">Linux学院</a></li> <li><a href="http://luffy.oldboyedu.com">路飞学城</a></li> </ul> <ul class="nav navbar-nav navbar-right"> <li><a href="#">好好学习</a></li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">联系我们<span class="caret"></span></a> <ul class="dropdown-menu"> <li><a href="#">Rain</a></li> <li><a href="#">Egon</a></li> <li><a href="#">Yuan</a></li> <li role="separator" class="divider"></li> <li><a href="#">Q1mi</a></li> </ul> </li> </ul> </div><!-- /.navbar-collapse --> </div><!-- /.container-fluid --> </nav> <!--导航栏结束--> <div class="container"> <div class="jumbotron"> <div id="j1" class="container"> <h1 class="c1">沙河前端小王子</h1> <h1 class="c1">带你学习jQuery</h1>
转载于:https://www.cnblogs.com/geng-xiaoqiaoliushui/p/10878026.html