<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<title>IE6-bootstrap测试</title>
<!-- 第1步， 在 <head>
中添加以下css文件： -->
<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
<!--[if lte IE 6]>
<link rel="stylesheet" type="text/css" href="css/bootstrap-ie6.css">
<![endif]-->
<!--[if lte IE 7]>
<link rel="stylesheet" type="text/css" href="css/ie.css">
<![endif]-->
</head>
<body>
<p class="text-danger">查看源代码请按下f12查看</p>
<h1>排版--强调class</h1>
<code>
text-muted
<br>
text-primary<br>
text-success<br>
text-info<br>
text-warning<br>
text-danger<br></code>
<p class="text-muted">这些class通过颜色来表示强调。也可以应用于链接，当鼠标盘旋于链接上时，其颜色会变深，就像默认的链接样式。</p>
<p class="text-primary">这些class通过颜色来表示强调。也可以应用于链接，当鼠标盘旋于链接上时，其颜色会变深，就像默认的链接样式。</p>
<p class="text-success">这些class通过颜色来表示强调。也可以应用于链接，当鼠标盘旋于链接上时，其颜色会变深，就像默认的链接样式。</p>
<p class="text-info">这些class通过颜色来表示强调。也可以应用于链接，当鼠标盘旋于链接上时，其颜色会变深，就像默认的链接样式。</p>
<p class="text-warning">这些class通过颜色来表示强调。也可以应用于链接，当鼠标盘旋于链接上时，其颜色会变深，就像默认的链接样式。</p>
<p class="text-danger">这些class通过颜色来表示强调。也可以应用于链接，当鼠标盘旋于链接上时，其颜色会变深，就像默认的链接样式。</p>
<h1>表格</h1>
<table class="table table-hover">
<thead>
<td>用户名</td>
<td>密码</td>
</thead>
<tbody>
<tr>
<td>dcd</td>
<td>xxxx</td>
</tr>
<tr>
<td>xx</td>
<td>xxx</td>
</tr>
<tr>
<td>xxx</td>
<td>xxx</td>
</tr>
</tbody>
</table>
<h1>表单</h1>
<form role="form">
<div class="form-group">
<label for="exampleInputEmail1">Email address</label>
<input type="email" class="form-control" id="exampleInputEmail1" placeholder="Enter email">
</div>
<div class="form-group">
<label for="exampleInputPassword1">Password</label>
<input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password">
</div>
<div class="form-group">
<label for="exampleInputFile">File input</label>
<input type="file" id="exampleInputFile">
<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>
<h1>按钮</h1>
<div>
<button class="btn btn-default" type="button">默认</button>
<button class="btn btn-primary" type="button">主要</button>
<button class="btn btn-success" type="button">成功</button>
<button class="btn btn-info" type="button">信息</button>
<button class="btn btn-warning" type="button">警告</button>
<button class="btn btn-danger" type="button">危险</button>
<button class="btn btn-link" type="button">链接</button>
</div>
<h2>可作按钮使用的HTML标签</h2>
<p>可以为 <code><a></code> 、<code><button></code>或<code><input></code>元素添加按钮class。我们强烈建议尽可能使用<code><button></code>元素以确保跨浏览器的一致性样式。</p>
<div>
<a class="btn btn-default" href="#" role="button">Link</a>
<button class="btn btn-default" type="submit">Button</button>
<input class="btn btn-default" type="button" value="Input">
<input class="btn btn-default" type="submit" value="Submit">
</div>
<!-- 第2步，在html文档结尾处加入以下的javascript文件： -->
<script src="js/jquery/1.10.2/jquery.min.js"></script>
<!--[if lte IE 6]>
<script type="text/javascript" src="js/bootstrap.js"></script>
<!-- bsie js 补丁只在IE6中才执行 -->
<script type="text/javascript" src="js/bootstrap-ie.js"></script>
<![endif]-->
</body>
</html>
bootstrap-ie练习
需积分: 4 119 浏览量
2014-04-08
01:23:05
上传
评论
收藏 1.18MB RAR 举报
bootstrap-ie练习.rar （23个子文件） 
ie练习 css 
bootstrap-theme.css 14KB bootstrap.min.css 97KB ie.css 1KB bootstrap.css 120KB bootstrap-theme.min.css 13KB bootstrap-ie6.min.css 94KB bootstrap-ie6.css 113KB img 
bootstrap-slide-03.jpg 48KB slide-02.jpg 134KB slide-03.jpg 134KB slide-01.jpg 81KB
browser-icon-chrome.png 54KB browser-icon-firefox.png 172KB bootstrap-slide-02.jpg 79KB browser-icon-safari.png 205KB media.png 368B bootstrap-slide-01.jpg 122KB
index.html 4KB js jquery 1.10.2 jquery.js 267KB jquery.min.js 91KB bootstrap.min.js 27KB bootstrap-ie.js 14KB bootstrap.js 57KB资源评论
