<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" href="../BootStrap/day1/bootstrap/bootstrap-3.3.5-dist/css/bootstrap.css"/> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <style type="text/css"> .scrollspy-example { height: 200px; position: relative; overflow: auto; border: 1px solid red; } .bs-example-popover { position: relative; float: left; display: block; width: auto;; margin: 20px; border: 1px solid red; } /*.bs-example{*/ /*position: relative;*/ /*float:left;*/ /*display: block;*/ /*width: 240px;*/ /*margin: 20px;*/ /*}*/ </style> </head> <body> <div class="dropdown" style="position: relative;left: 20px;"> <button class="btn btn-danger" type="button" data-toggle="dropdown" id="dropdownMenu">下拉</button> <ul class="dropdown-menu dropdown-menu-left" aria-labelledby="dropdownMenu"> <li class="disabled"><a href="#">ACTION</a></li> <li><a href="#">ACTION</a></li> <li><a href="#">ACTION</a></li> <li><a href="#">ACTION</a></li> </ul> <div class="btn-toolbar" role="toolbar" > <div class="btn-group" role="group">btn1</div> <div class="btn-group" role="group">btn2</div> <div class="btn-group" role="group"> <button type="button" class="btn btn-default">btn21</button> <button type="button" class="btn btn-default">btn22</button> <div class="btn-group" role="group"> <div class="dropdown"> <button class="btn btn-danger" type="button" data-toggle="dropdown" id=" dropdownMenu">下拉 <span class="caret"></span> </button> <ul class="dropdown-menu" aria-labelledby="dropdownMenu"> <li class="disabled"><a href="#">ACTION</a></li> <li role="separator" class="divider"><a href="#">ACTION</a></li> <li><a href="#">ACTION</a></li> <li><a href="#">ACTION</a></li> </ul> </div> </div> </div> </div> </div> <div class="row"> <div class="col-lg-6"> <input type="text" class="form-control" placeholder="search-for"/> </div> <!--<span class="input-group-btn">--> <!--<button type="button">GO!</button>--> <!--</span>--> <div class="col-lg-6 btn-group" role="group"> <div class=" dropdown col-lg-12"> <button type="button" class="btn-default btn" data-toggle="dropdown" id="drop_down_menu">下拉 <span class="caret"></span> </button> <ul class="dropdown-menu" aria-labelledby="drop_down_menu"> <li><a href="#">1</a></li> <li class="disabled"><a href="#">2</a></li> <li><a href="#">3</a></li> </ul> </div> </div> </div> <ul class="nav nav-tabs nav-tabs-justified"> <li class="presentation"><a href="#">nav1</a></li> <li class="presentation"><a href="#">nav2</a></li> <li class="presentation"><a href="#">nav3</a></li> </ul> <ul class="nav nav-tabs nav-tabs-justified nav-stacked"> <li class="presentation"><a href="#">nav4</a></li> <li class="presentation"><a href="#">nav5</a></li> <li class="presentation"><a href="#">nav6</a></li> </ul> <ul class="nav nav-pills "> <li class="presentation"><a href="#">nav4</a></li> <li class="presentation"><a href="#">nav5</a></li> <li class="presentation"><a href="#">nav6</a></li> </ul> <ul class="nav nav-pills"> <li role="presentation" class="dropdown"> <a class="dropdown-toggle" data-toggle="dropdown" role="button" href="#">Dropdown<span class="caret"></span> </a> <ul class="dropdown-menu"> <li><a href="#">navdropdown1</a></li> <li><a href="#">navdropdown2</a></li> <li><a href="#">navdropdown3</a></li> </ul> </li> <li class="presentation"><a href="#">nav2</a></li> <li class="presentation"><a href="#">nav3</a></li> </ul> <button type="button" class="btn btn-default navbar-btn">SIGN IN</button> <p class="navbar-text">Sign in as mark</p> <nav style="position: relative;left: 20px;"> <ul class="pagination"> <li class="disabled"> <span aria-hidden="true"><</span> </li> <li class="active"> <span>> </span> </li> </ul> </nav> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100" style="width: 50%;"> <span class="sr-only">50%complate</span> </div> </div> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100" style="width: 50%;"> 50%; </div> </div> <div class="progress"> <div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100" style="width: 5%;"> 5%; </div> <div class="progress-bar progress-bar-success " role="progressbar" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100" style="width: 15%;"> 15%; </div> <div class="progress-bar progress-bar-info " role="progressbar" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100" style="width: 25%;"> 25%; </div> <div class="progress-bar progress-bar-warning " role="progressbar" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100" style="width: 35%;"> 35%; </div> </div> <div class="progress"> <div class="progress-bar progress-bar-striped active" role="progressbar" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100" style="width: 35%;"> 15%; </div> </div> <div class="media"> <div class="media-left"> <a href="#"> <img class="media-object" src="../BootStrap/day1/image/5dab1df8b669f3b31e17e62967a_p24_mk24.jpg"/> </a> </div> <div class="media-left media-body"> <a href="#"> <img class="media-object" src="../BootStrap/day1/image/41MifCrhC4L._SX_.jpg"/> </a> </div> //默认的大小决定了只能放下left,body；right没有显示出来，只有到下一行了. <div class="media-left media-body"> <a href="#"> <img class="media-object" src="../BootStrap/day1/image/10239466_691289.jpg"/> </a> </div> </div> <ul class="list-group"> <li class="list-group-item"> <span class="badge">微章1</span>微章content </li> <li class="list-group-item"> <span class="badge">微章2</span>微章content </li> <li class="list-group-item"> <span class="badge">微章3</span>微章content </li> <li class="list-group-item"> <span class="badge">微章4</span>微章content </li> </ul> <div class="list-group"> <a href="#" class="list-group-item active">href1</a> <a href="#" class="list-group-item disabled">href3</a> <a href="#" class="list-group-item ">href3</a> <a href="#" class="list-group-item ">href4</a> </div> <div class="panel panel-default"> <div class="pane-heading"><h3>panel-heading</h3></div> <div class="panel-body">panel-body</div> <div class="panel-body">panel-body2</div> <div class="panel-footer">panel-footer</div> </div> <div class="well">well</div> <div class="well">well2</div> <div class="well">well3</div> <div style="position: relative;left: 40px;"> <button type="button" class="modalButton">modal</button> <button class="btn btn-primary" data-toggle="modal" data-target="#myModal">模态框</button> <div class="modal fade" id="myModal" role="dialog" aria-labelledby="myModalLable" tabindex="-1"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">CLOSE</span> </button> <h4 id="myModalLable" class="modal-title">modal-title</h4> </div> <div class="modal-body"> <span>modal-body</span> </div> <div class="modal-footer"> <button type="button" class="btn btn-primary" data-dismiss="modal">close</button> </div> </div> </div> </div> <div class="dropdown"> <a role="button" class="dropdown-toggle" id="dropDown" data-target="#"> DROPDOWN<span class="caret"></span> </a> <ul class="dropdown-menu" role="menu" aria-labelledby="dropDown"> <li><a href="#">dropdown-menu1</a></li> <li><a href="#">dropdown-menu2</a></li> </ul> <button class="btn-primary" id="dropdownLink">dropdownLink</button> <button class="btn-primary" id="dropdownLinkHidden3">dropdownLink3</button> </div> </div> <div class="container"> <nav id="navbar-example" class="navbar navbar-default navbar-static" role="navigation"> <div class="navbar-header"> <button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".bs"> <span class="sr-only">R</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="#fat">Project name</a> </div> <div class="collapse navbar-collapse bs-js-navbar-scrollspy"> <ul class="nav navbar-nav"> <li class="active"><a href="#">local</a></li> <li class="dropdown"> <a href="#" id="navbarDrop" data-toggle="dropdown" class="dropdown-toggle">DropDown<span class="caret"></span> </a> <ul class="dropdown-menu" role="menu" aria-labelledby="navbarDrop"> <li><a href="#one" tabindex="-1">one</a></li> <li><a href="#two" tabindex="-1">two</a></li> <li class="divider"></li> </ul> </li> </ul> </div> </nav> <div class="scrollspy-example" data-offset="0" data-spy="scroll" data-target="#navbar-example"> <h2 id="fat">FAT</h2> <P>langurages needed</P> <h2 id="one">ONE</h2> <P>langurages needed</P> <h2 id="two">TWO</h2> <P>langurages needed</P> <h2 id="three">Three</h2> <P>langurages needed</P> <h2 id="four">Four</h2> <P>langurages needed</P> <h2 id="five">Five</h2> <P>langurages needed</P> </div> </div> <div class="container"> <ul class="nav nav-tabs" id="myTable"> <li><a href="#home">nav1</a></li> <li><a href="#aboutus">nav2</a></li> <li><a href="#message">nav3</a></li> <li><a href="#setting">nav4</a></li> <li class="dropdown"> <a href="#" data-toggle="dropdown" class="dropdown-toggle">dropdown<span class="caret"></span> </a> <ul class="dropdown-menu"> <li><a href="#aaa">linkaaa</a></li> 0000000000000 <li><a href="#bbb">linkbbb</a></li> <li><a href="#ccc">linkccc</a></li> </ul> </li> </ul> <div class="tab tab-content"> <div class="tab-pane active" id="home"><span>text text table line bigsquare car banane apple hello watch sex saas work job find yuan dollar family living left wc phone pc eat sleep friendship font-end play girl-friend movie music find talk learning </span> </div> <div class="tab-pane active" id="aboutus"><span>text text table line bigsquare car banane apple hello watch sex saas work job find yuan dollar family living left wc phone pc eat sleep friendship font-end play girl-friend movie music find talk learningtext text table line bigsquare car banane apple hello watch sex saas work job find yuan dollar family living left wc phone pc eat sleep friendship font-end play girl-friend movie music find talk learning </span> </div> <div class="tab-pane active" id="message"><span>text text table line bigsquare car banane apple hello watch sex saas work job find yuan dollar family living left wc phone pc eat sleep friendship font-end play girl-friend movie music find talk learningtext text table line bigsquare car banane apple hello watch sex saas work job find yuan dollar family living left wc phone pc eat sleep friendship font-end play girl-friend movie music find talk learningtext text table line bigsquare car banane apple hello watch sex saas work job find yuan dollar family living left wc phone pc eat sleep friendship font-end play girl-friend movie music find talk learning </span> </div> <div class="tab-pane active" id="setting"><span>text text table line bigsquare car banane apple hello watch sex saas work job find yuan dollar family living left wc phone pc eat sleep friendship font-end play girl-friend movie music find talk learning text text table line bigsquare car banane apple hello watch sex saas work job find yuan dollar family living left wc phone pc eat sleep friendship font-end play girl-friend movie music find talk learning text text table line bigsquare car banane apple hello watch sex saas work job find yuan dollar family living left wc phone pc eat sleep friendship font-end play girl-friend movie music find talk learning text text table line bigsquare car banane apple hello watch sex saas work job find yuan dollar family living left wc phone pc eat sleep friendship font-end play girl-friend movie music find talk learning </span> </div> </div> </div> <div style="position: relative;left: 40px;"> <a class="btn btn-lg btn-danger" id="a1" data-placement="right" data-content="体重是最为常用的衡量好身材的标准。标准体重计算可以以BMI为标杆。BMI指的是身体质量指数，是用体重公斤数除以身高米数平方得出的数字，是目前国际上常用的衡量人体胖瘦程度以及是否健康的一个标准。在中国标准，BMI≥28便是肥胖。
除了用BMI来判断肥瘦之外，还可以看体脂率。体脂率是指人体内脂肪重量在人体总体重中所占的比例。一般来说，男性体脂率在10%~20%为正常，女性体脂率在17%~30%为标准情况。但是这个标准会随着年龄变化而改变。女性超过50岁，男性超过55岁，每增加5岁，体脂率的标准可上调2%~3%。体脂率的计算方式如下：
BMI=体重（kg）÷身高2（m）
体脂率=1.2×BMI+0.23×年龄-5.4-10.8×性别（男为1，女为0）
" data-original-title="洗碗">please click here</a> </div> <!--<div class="bs-example">--> <!--<div class="bs-example-popover">--> <!--<button type="button" class="btn btn-danger" data-container="body" data-target="popover" data-placement="righy--> <!--t">click here--> <!--</button>--> <!--</div>--> <!--</div>--> <div style=" position: relative;top:40px;"> <div id="alert1" class="alert alert-warning fade in"> <button id="alert1" type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button> <strong>people plgins</strong> </div> <div id="alert2" class="alert alert-warning fade in"> <button id="alert2" type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button> <strong>people plgins</strong> </div> <div id="alert3" class="alert alert-warning fade in"> <button id="alert3" type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button> <strong>people plgins</strong> </div> <div id="alert4" class="alert alert-warning fade in"> <button id="alert4" type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button> <strong>people plgins</strong> </div> </div> <div class="alert alert-danger fade in"> <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button> <h3>我叫小沈阳</h3> <a href="http://www.xicxi.com/lossless/6913.html"><p>music</p></a> <button type="button" class="btn btn-danger">师傅 赵本上</button> <button type="button" class="btn btn-danger">师妹 狗蛋</button> <button type="button" class="btn btn-primary">有个毕姥爷</button> <button type="button" class="btn btn-lg btn-warning">中央电视台</button> <button type="button" class="btn btn-xs btn-warning">铁岭电视台</button> </p> <div class="alert alert-warning fade in"> <button type="button" οnclick="btnnn()" class="close" aria-hidden="true">×</button> <b>我叫小沈阳，又名也叫小沈阳</b> </div> </div> <div style="position: relative;margin: 0 auto;;left: 40px;;"> <button id="loading" type="button" data-loading-text="正在加载..." class="btn btn-primary">Loading State</button> <button type="button" class="btn btn-primary" data-toggle="button">Single button</button> <div class="btn btn-group" data-toggle="buttons"> <label class="btn btn-primary"><input type="checkbox">option1</label> <label class="btn btn-primary"><input type="checkbox">option2</label> <label class="btn btn-primary"><input type="checkbox">option3</label> </div> <div class="btn btn-group" data-toggle="buttons"> <label class="btn btn-primary"><input type="radio" name="options" id="option1">option1 </label> <label class="btn btn-primary"><input type="radio" name="options" id="option2">option2 </label> <label class="btn btn-primary"><input type="radio" name="options" id="option3">option3 </label> </div> <button class="btn btn-primary" id="btn" data-toggle="button">单独开关</button> <a href="javascript:void(0)" class="btn btn-success" οnclick="Switch()">切换</a> </div> <div class="container"> <div class="panel-group" id="accordion"> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a href="#collapseOne" data-toggle="collapse" data-parent="#accordion">collapseOne</a> </h4> </div> <div id="collapseOne" class="collapse panel-collapse in">collapseOne text <br/> 美丽的草原 </div> </div> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a href="#collapseTwo" data-toggle="collapse" data-parent="#accordion">collapseTwo</a> </h4> </div> <div id="collapseTwo" class="collapse panel-collapse in">collapseTwo text <br/> 美丽的草原 </div> </div> </div> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a href="#collapseThree" data-toggle="collapse" data-parent="#accordion">collapseTwo</a> </h4> </div> <div id="collapseThree" class="collapse panel-collapse in">collapseTwo text <br/> 美丽的草原 </div> </div> </div> <div style="margin:0 auto;position: relative;left: 40px;;"> <div class="container2"> <button type="button" class="btn btn-primary" data-toggle="collapse" data-target="#demoooo">all collapse in four house </button> <div id="demoooo" class="collapse in">方法笔记侠</div> </div> <button type="button" class="btn btn-primary" οnclick="Open()">打开开啊</button> <button type="button" class="btn btn-primary" οnclick="Close()">快关</button> <div class="collapse in" id="demo2">open or close?写一首简单的歌，没有什么独特！？</div> </div> <div style="width: 500px;margin-left:auto; margin-right: auto"> <div id="lunbo-example" class="carousel slide" data-ride="carousel"> <ol class="carousel-indicators"> <li data-target="#lunbo-example" data-slide-to="0" class="active"></li> <li data-target="#lunbo-example" data-slide-to="1"></li> <li data-target="#lunbo-example" data-slide-to="2"></li> </ol> <div class="carousel-inner" style="text-align: center;"> <div class="item active"> <img src="../BootStrap/day1/image/41MifCrhC4L._SX_.jpg" alt="FirstImage"/> <div class="carousel-caption"> <h4>真的要哭了</h4> <p>丑哭的吧</p> </div> </div> <div class="item"> <img src="../BootStrap/day1/image/10239466_691289.jpg" alt="SecondImage"/> <div class="carousel-caption">丑哭2</div> </div> <div class="item"> <img src="../BootStrap/day1/image/5dab1df8b669f3b31e17e62967a_p24_mk24.jpg" alt="TheedImage"/> <div class="carousel-caption">丑哭3</div> </div> </div> <a href="#lunbo-example" data-slide="prev" class="left carousel-control"> <span class="glyphicon glyphicon-chevron-left"></span> </a> <a href="#lunbo-example" data-slide="next" class="right carousel-control"> <span class="glyphicon glyphicon-chevron-right"></span> </a> </div> </div> </body> <script type="text/javascript" src="../BootStrap/day1/bootstrap/bootstrap-3.3.5-dist/js/jquery-1.11.3.js"></script> <script type="text/javascript" src="../BootStrap/day1/bootstrap/bootstrap-3.3.5-dist/js/bootstrap.js"></script> <script> $("#dropdownLink").dropdown(); // $("#dropdownLinkHidden3").dropdown().toggle(); $("#myTable a").click(function (e) { $("#a1").popover(); $("[data-toggle=popover]").popover(); }); function btnnn() { alert("close"); } $('#loading').click(function () { var btn = $('this'); btn.button('loading') }); function Switch() { $("#btn").button('toggle'); } $(function () { $("#demo2").collapse({ toggle: false }) }); function Open() { $("#demo2").collapse("show"); } function Close() { $("#demo2").collapse("hide"); } $(".carousel").carousel({ interval: 2000, pause: "hover" }) </script> </html>
五一来了o(╯□╰)o
2743
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
