Bootstrap-导航条-栅格系统-Carousel(轮播效果)-标签页资源-CSDN文库

共10个文件

jpg：6个

html：2个

js：1个

bootstrap

5星 · 超过95%的资源需积分: 50 75 浏览量 2015-01-21 17:10:46 上传评论 1 收藏 746KB RAR 举报

资源推荐

资源详情

资源评论

收起资源包目录

bootstrap_demo.rar （10个子文件）

bootstrap_demo

Index.html 9KB

images

2.jpg 369KB

6.jpg 134KB

1.jpg 172KB

zhao.jpg 12KB

bg_header_News.jpg 15KB

su.jpg 16KB

bootstrap.min.js 34KB

css

bootstrap3.min.css 111KB

List.html 7KB

<!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>传智播客</title>  <link href="css/bootstrap3.min.css" rel="stylesheet">    <style type="text/css"> body { padding-top:50px; } .carousel-inner .item img { width:100%; height:400px; } </style> </head> <body> <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation"> <div class="container-fluid">  <div class="navbar-header"> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">  <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="#">.Net传智播客</a> </div> <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> <ul class="nav navbar-nav"> <li class="active"><a href="#">首页</a></li> <li class="dropdown"> <a class="dropdown-toggle" href="#" id="dropdownMenu1" data-toggle="dropdown"> .Net培训教程 <span class="caret"></span> </a> <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1"> <li role="presentation"><a role="menuitem" tabindex="-1" href="#">.Net基础班</a></li> <li role="presentation"><a role="menuitem" tabindex="-1" href="#">.Net就业班</a></li> <li role="presentation"><a role="menuitem" tabindex="-1" href="#">.Net远程班</a></li> </ul> </li> <li><a href="#">.Net视频下载</a></li> <li><a href="#">人才服务</a></li> <li><a href="#">校园生活</a></li> </ul> </div> </div> </nav>  <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">  <ol class="carousel-indicators"> <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li> <li data-target="#carousel-example-generic" data-slide-to="1"></li> <li data-target="#carousel-example-generic" data-slide-to="2"></li> </ol>  <div class="carousel-inner" role="listbox"> <div class="item active"> <img src="/images/1.jpg" alt="传智播客美女真多啊啊!!大家快来啊!!"> <div class="carousel-caption"> <h3>传智播客美女真多啊啊!!大家快来啊!!</h3> </div> </div> <div class="item"> <img src="/images/2.jpg" alt="传智播客帅哥真多啊啊!!大家快来啊!!"> <div class="carousel-caption"> <h3> 传智播客帅哥真多啊啊!!大家快来啊!!</h3> </div> </div> <div class="item"> <img src="/images/6.jpg" alt="传智播客牛逼的老师真多啊啊!!大家快来啊!!"> <div class="carousel-caption"> <h3>传智播客牛逼的老师真多啊啊!!大家快来啊!!</h3> </div> </div> </div>  <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev"> <span class="glyphicon glyphicon-chevron-left"></span> <span class="sr-only">Previous</span> </a> <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next"> <span class="glyphicon glyphicon-chevron-right"></span> <span class="sr-only">Next</span> </a> </div>  <div class="container"> <div class="row"> <div class="col-sm-4"> <img class="img-circle" src="/images/su.jpg" alt="苏坤"> <h2>苏坤</h2> <p>主讲课程：C#基础、HTML、JavaScript、ASP.Net基础、图书在线销售网站项目、Silverlight、Windows8、Unity3D</p> <p><a class="btn btn-default" href="#" role="button">详细</a></p> </div> <div class="col-sm-4"> <img class="img-circle" src="/images/su.jpg" alt="苏坤"> <h2>苏坤</h2> <p>主讲课程：C#基础、HTML、JavaScript、ASP.Net基础、图书在线销售网站项目、Silverlight、Windows8、Unity3D</p> <p><a class="btn btn-default" href="#" role="button">详细</a></p> </div> <div class="col-sm-4"> <img class="img-circle" src="/images/su.jpg" alt="苏坤"> <h2>苏坤</h2> <p>主讲课程：C#基础、HTML、JavaScript、ASP.Net基础、图书在线销售网站项目、Silverlight、Windows8、Unity3D</p> <p><a class="btn btn-default" href="#" role="button">详细</a></p> </div> </div>  <ul class="nav nav-tabs" role="tablist"> <li role="presentation" class="active"><a href="#home" role="tab" data-toggle="tab">苏坤</a></li> <li role="presentation"><a href="#profile" role="tab" data-toggle="tab">苏坤</a></li> <li role="presentation"><a href="#messages" role="tab" data-toggle="tab">赵剑宇</a></li> </ul>  <div class="tab-content"> <div role="tabpanel" class="tab-pane active" id="home"> <div class="row"> <div class="col-sm-7"> <h2>苏坤</h2> <p style="font-size: 14px">高级讲师，软件开发工程师、项目经理 8年软件开发经验，2007年开始从事软件开发教学工作，课程注重于实战，对每一个知识点的讲解循序渐进、由浅入深，使学生能够快乐学习并在学习过程中培养独立思考能力。主导和参与了某省福彩网上投注、某省电信LED控制系统、基于手持终端的无线点餐系统、大型超市与供货商B2B交互系统及进销存管理系统等项目。</p> </div> <div class="col-sm-5"> <img class="feature-image img-responsive" src="/images/su.jpg" alt="苏坤" style="margin-top: 10px"> </div> </div> </div> <div role="tabpanel" class="tab-pane" id="profile"> <div class="row"> <div class="col-sm-7"> <h2>苏坤</h2> <p style="font-size: 14px">高级讲师，软件开发工程师、项目经理 8年软件开发经验，2007年开始从事软件开发教学工作，课程注重于实战，对每一个知识点的讲解循序渐进、由浅入深，使学生能够快乐学习并在学习过程中培养独立思考能力。主导和参与了某省福彩网上投注、某省电信LED控制系统、基于手持终端的无线点餐系统、大型超市与供货商B2B交互系统及进销存管理系统等项目。</p> </div> <div class="col-sm-5"> <img cla

评论收藏

内容反馈