标签:des style class code java http
<!DOCTYPE html>
<html>
<head>
<title>Bootstrap 101 Template</title>
<meta
name="viewport" content="width=device-width,
initial-scale=1.0">
<!-- Bootstrap
-->
<link rel="stylesheet" href="http://cdn.bootcss.com/twitter-bootstrap/3.0.3/css/bootstrap.min.css">
<link href="@Url.Content("~/Content/bootstrap.min.css")" rel="stylesheet"
type="text/css" />
<!-- HTML5 Shim and Respond.js
IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn‘t work if you view the page via file://
-->
<!--[if lt IE
9]>
<script src="http://cdn.bootcss.com/html5shiv/3.7.0/html5shiv.min.js"></script>
<script src="http://cdn.bootcss.com/respond.js/1.3.0/respond.min.js"></script>
<![endif]-->
<style>
body
{
padding-top: 70px;
}
/* Set the fixed height of the
footer here */
#footer
{
height:
auto;
background-color: #f5f5f5;
}
#header
{
margin-top: -20px;
}
</style>
</head>
<body>
<nav
class="navbar navbar-default navbar-fixed-top"
role="navigation">
<div
class="container">
<!-- Brand and toggle get grouped for better mobile display
-->
<div
class="navbar-header">
<button type="button" class="navbar-toggle" 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="#">Brand</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling
-->
<div class="collapse navbar-collapse"
id="bs-example-navbar-collapse-1">
<ul class="nav
navbar-nav">
<li class="active"><a
href="#">Link</a></li>
<li><a
href="#">Link</a></li>
<li class="dropdown"><a href="#" class="dropdown-toggle"
data-toggle="dropdown">Dropdown
<b
class="caret"></b></a>
<ul
class="dropdown-menu">
<li><a
href="#">Action</a></li>
<li><a href="#">Another
action</a></li>
<li><a href="#">Something else
here</a></li>
<li
class="divider"></li>
<li><a href="#">Separated
link</a></li>
<li
class="divider"></li>
<li><a href="#">One more separated
link</a></li>
</ul>
</li>
</ul>
<form class="navbar-form navbar-left"
role="search">
<div
class="form-group">
<input type="text" class="form-control"
placeholder="Search">
</div>
<button type="submit" class="btn
btn-default">
Submit</button>
</form>
<ul class="nav navbar-nav
navbar-right">
<li>
<p
class="navbar-text">
Welcome,Lily.</p>
</li>
<li><a
href="#">Link</a></li>
<li class="dropdown"><a href="#" class="dropdown-toggle"
data-toggle="dropdown">Dropdown
<b
class="caret"></b></a>
<ul
class="dropdown-menu">
<li><a
href="#">Action</a></li>
<li><a href="#">Another
action</a></li>
<li><a href="#">Something else
here</a></li>
<li
class="divider"></li>
<li><a href="#">Separated
link</a></li>
</ul>
</li>
</ul>
</div>
<!-- /.navbar-collapse -->
</div>
</nav>
<div
id="header" class="jumbotron
hidden-xs">
<div
class="container">
<h1>
Hello,
world!</h1>
<p>
This is a simple hero unit, a simple jumbotron-style component for calling
extra
attention to featured content or
information.</p>
<p>
<a class="btn btn-primary btn-lg" role="button">Learn
more</a></p>
</div>
</div>
<div
class="container">
<div
class="row">
<div
class="col-md-3">
<div class=" hidden-print "
role="complementary">
<ul class="nav
">
<li class="active"><a
href="#download">下载Bootstrap</a>
<ul
class="nav">
<li class=""><a
href="#download-compiled">编译后的CSS、JS和字体文件</a></li>
<li class=""><a
href="#download-additional">额外的下载渠道</a></li>
<li class=""><a href="#download-cdn">Bootstrap
CDN</a></li>
</ul>
</li>
<li class=""><a
href="#whats-included">包含了哪些文件</a>
<ul
class="nav">
<li class=""><a
href="#whats-included-precompiled">编译版</a></li>
<li class=""><a
href="#whats-included-source">源码</a></li>
</ul>
</li>
</ul>
</div>
</div>
<div class="col-md-9"
role="main">
<!-- Getting
started
==================================================
-->
<div>
<h1>
h1. Bootstrap
heading</h1>
<p>
Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque
penatibus
et magnis dis parturient montes, nascetur ridiculus mus. Nullam id dolor id
nibh
ultricies vehicula. Cum sociis natoque penatibus et magnis dis parturient
montes,
nascetur ridiculus mus. Donec ullamcorper nulla non metus auctor fringilla.
Duis
mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio
sem
nec elit. Donec ullamcorper nulla non metus auctor fringilla. Maecenas sed
diam
eget risus varius blandit sit amet non magna. Donec id elit non mi porta
gravida
at eget metus. Duis mollis, est non commodo luctus, nisi erat porttitor
ligula,
eget lacinia odio sem nec
elit.
</p>
<p
class="text-muted">
Fusce dapibus, tellus ac cursus commodo, tortor mauris
nibh.</p>
<p
class="text-primary">
Nullam id dolor id nibh ultricies vehicula ut id
elit.</p>
<p
class="text-success">
Duis mollis, est non commodo luctus, nisi erat porttitor
ligula.</p>
<p
class="text-info">
Maecenas sed diam eget risus varius blandit sit amet non
magna.</p>
<p
class="text-warning">
Etiam porta sem malesuada magna mollis
euismod.</p>
<p
class="text-danger">
Donec ullamcorper nulla non metus auctor
fringilla.</p>
<table class="table
table-hover">
<thead>
<tr>
<th>
#
</th>
<th>
First
Name
</th>
<th>
Last
Name
</th>
<th>
Username
</th>
</tr>
</thead>
<tbody>
<tr>
<td>
1
</td>
<td>
Mark
</td>
<td>
Otto
</td>
<td>
@@mdo
</td>
</tr>
<tr>
<td>
2
</td>
<td>
Jacob
</td>
<td>
Thornton
</td>
<td>
@@fat
</td>
</tr>
<tr>
<td>
3
</td>
<td
colspan="2">
Larry the
Bird
</td>
<td>
@@twitter
</td>
</tr>
</tbody>
</table>
<form
role="form">
<div
class="form-group">
<label
for="exampleInputEmail1">
Email
address</label>
<input class="form-control" id="exampleInputEmail1" placeholder="Enter email"
type="email">
</div>
<div
class="form-group">
<label
for="exampleInputPassword1">
Password</label>
<input class="form-control" id="exampleInputPassword1" placeholder="Password"
type="password">
</div>
<div
class="form-group">
<label
for="exampleInputFile">
File
input</label>
<input id="exampleInputFile"
type="file">
<p
class="help-block">
Example block-level help text
here.</p>
</div>
<div
class="checkbox">
<label>
<input
type="checkbox">
Check me
out
</label>
</div>
<button type="submit" class="btn
btn-default">
Submit</button>
</form>
@RenderBody()
</div>
</div>
</div>
</div>
<div
id="footer">
<div
class="container">
<p
class="text-muted">
Designed and built with all the love in the world by <a href="http://twitter.com/mdo"
target="_blank">@@mdo</a> and <a href="http://twitter.com/fat"
target="_blank">@@fat</a>.</p>
<p>
Code licensed under <a href="http://www.apache.org/licenses/LICENSE-2.0"
target="_blank">
Apache License v2.0</a>, documentation under <a href="http://creativecommons.org/licenses/by/3.0/">
CC BY
3.0</a>.</p>
<p>
Bootstrap中文文档版权归<a href="http://www.bootcss.com/">Bootstrap中文网</a>及<a
href="mailto:wangsai@bootcss.com">译者</a>所有。</p>
<p>
</p>
</div>
</div>
<!--
jQuery (necessary for Bootstrap‘s JavaScript plugins)
-->
<script
src="@Url.Content("~/Scripts/jquery-1.9.1.min.js")"
type="text/javascript"></script>
<!-- Include
all compiled plugins (below), or include individual files as needed
-->
<script
src="@Url.Content("~/Scripts/bootstrap.min.js")"
type="text/javascript"></script>
</body>
</html>
标签:des style class code java http
原文地址:http://www.cnblogs.com/jes_shaw/p/3781733.html