打开APP
userphoto
未登录

开通VIP,畅享免费电子书等14项超值服

开通VIP
面包屑导航--用一个带方向的层次表明当前页面的位置。
      ******************面包屑导航*************************
      *用一个带方向的层次表明当前页面的位置。
      *割符自动地通过CSS的:before和content添加上了。
      *
      *使用到的面包屑样式:breadcrumb
      *******************************************

效果图:
 
 

源码:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="shortcut icon" href="../../docs-assets/ico/favicon.png">

    <title>Navbar Template for Bootstrap</title>

    <link rel="stylesheet" href="../../css/bootstrap.min.css" type="text/css"></link>
  </head>
  
  <body>
  <!--
  ******************面包屑导航*************************
      *用一个带方向的层次表明当前页面的位置。
      *割符自动地通过CSS的:before和content添加上了。
      *谁处于活动状态,其class="active"
      *.nav-tabs类需要.nav基类。
      *
      *******************************************
  -->
  <div class="nav nav-default">
  <ol class="breadcrumb">
 <li><a href="#">Home</a></li>
 <li><a href="#">Library</a></li>
 <li class="active">Data</li>
</ol>
  
  </div>



  </body>
  <script type="text/javascript" src="../../js/jquery-2.0.0.min.js"></script>
  <script type="text/javascript" src="../../js/bootstrap.min.js"></script>
</html>

本站仅提供存储服务,所有内容均由用户发布,如发现有害或侵权内容,请点击举报
打开APP,阅读全文并永久保存 查看更多类似文章
猜你喜欢
类似文章
【热】打开小程序,算一算2024你的财运
20分钟打造你的Bootstrap站点 | css3教程
实现 Bootstrap 基本布局
基于Metronic的Bootstrap开发框架经验总结(11)--页面菜单的几种呈现方式
使用JSP实现简单的用户登录注册页面示例代码解析
BootStrap 侧边导航栏
解决Twitter Bootstrap Tab URL链接问题
更多类似文章 >>
生活服务
热点新闻
分享 收藏 导长图 关注 下载文章
绑定账号成功
后续可登录账号畅享VIP特权!
如果VIP功能使用有故障,
可点击这里联系客服!

联系客服