1 DOCTYPE html>
2 <html>
3 <head>
4 <meta charset="UTF-8">
5 <meta http-equiv="X-UA-Compatible" content="IE=edge">
6 <meta name="viewport" content="/>
7 <link rel="stylesheet" href="bootstrap-3.3.7-dist/css/bootstrap.css" />
8 <title>title>
9 <style>style>
10 head>
11 <body>
13 --导航条 包含容器,而不是容器包含导航条->
14 <div class="navbar navbar-default">
15 <div>
16
17 <a href="" class="navbar-brand">
18 <img src="img/Jellyfish.jpg" style="width:25px"/>
19 a>
20 <div class="navbar-header">
21 <button class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navdown" type="button">
22 <span class="icon-bar">span>
23 <span class="icon-bar">span>
24 <span class="icon-bar">span>
25 button>
26 div>
27
28 <div id="navdown" class="collapse navbar-collapse">
29 <ul class="nav navbar-nav">
30 <li><a href="">首页a>li>
31 <li><a href="">新闻a>li>
32 <li class="dropdown">
33 <a href="" data-toggle="dropdown">
34 产品大全<span class="caret">span>
35 a>
36 <ul class="dropdown-menu">
37 <li><a href="">修手机a>li>
38 <li><a href="">贴膜a>li>
39 <li><a href="">代驾a>li>
40 ul>
41 li>
42 <li><a href="">招聘a>li>
43 <li><a href="">帮助a>li>
44 ul>
45
46 <a href="" class="navbar-right navbar-link navbar-text" style="margin-right:5px;">登录a>
47 <span class="navbar-right navbar-text">|span>
48 <a href="" class="navbar-right navbar-link navbar-text">注册a>
49
50 <form action="" class="navbar-right navbar-form">
51 <div class=" input-group">
52 <input type="text" id="kw" class="form-control"/>
53 <div class="input-group-addon">
54 <span class="glyphicon glyphicon-search ">span>
55 div>
56 div>
57 form>
58 div>
59 div>
60 div>
61 <script src="js/jquery.js">script>
62 <script src="js/bootlint.js">script>
63 <script src="js/bootstrap.js">script>
64 <script>
65 bootlint.showLintReportForCurrentDocument([]);
66 script>
67
68 body>
69 html>