bootstrap3 - 导航（基础样式）

时间 2019-11-12

标签 bootstrap3 bootstrap 导航基础样式栏目 Bootstarp 繁體版

原文原文链接

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>导航（基础样式）</title>
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1"/>
    <link href="http://cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
  <ul class="nav nav-tabs">
    <li><a href="##">Home</a></li>
    <li><a href="##">CSS3</a></li>
    <li><a href="##">Sass</a></li>
    <li><a href="##">jQuery</a></li>
    <li><a href="##">Responsive</a></li>
  </ul>
  <script src="http://cdn.bootcss.com/jquery/2.1.4/jquery.min.js"></script>
  <script src="http://cdn.bootcss.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
</body>
</html>

...
<ul class="nav nav-pills>
...

Bootstrap框架中制做导航条主要经过“.nav”样式。默认的“.nav”样式不提供默认的导航样式，必须附加另一个样式才会有效，好比“nav-tabs”、“nav-pills”之类。好比右侧代码编辑器中就有一个tab导航条的例子，他的实现方法就是为ul标签加入.nav和nav-tabs两个类样式。css