<!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">
<!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
<title></title>
<link href="css/bootstrap.css" rel="stylesheet">
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<script src="http://cdn.bootcss.com/jquery/1.11.2/jquery.min.js"></script>
<script src="http://cdn.bootcss.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
</head>
<body>
<!-- 标题标签h1-h6 类以及small类作为副标题-->
<h1>this is the title<small>little title</small></h1>
<p class="lead">this is the title</p> <!--强调文本-->
<p> this is the <mark> title</mark></p><!--高亮文本-->
<del >this is the title</del> <!--删除文本-->
<br>
<s>this is no use title</s><!--无用文本-->
<br>
<ins>this line of text is meant to be treated</ins><!--插入文本--><br>
<strong>renderd as blod text</strong><!--强调文本--><br>
<em>render as italicized text</em><br>
<p class="text-left">left align text</p>
<p clbabbr>(123)456-7890
</address>
<!--引用加blockquote-reverse可以引用内容右对齐-->
<blockquote class="blockquote-reverse">
<p>this is a title ,consectetur adipiscing elit</p>
<footer>someone famous in<cite title="source title">source title</cite></footer>
</blockquote>
<!--无样式列表天假此类list-unstyled会清除样式-->
<ul class="list-unstyled">
<li> 1111</li>
<li>2222</li>
<li>3333</li>
</ul>
<!-- 内联列表 横排放置-->
<ul class="list-inline">
<li> 1111</li>
<li>2222</li>
<li>3333</li>
</ul>
<!-- 短语以及描述dt为短语，dd为描述-->
<dl class="dl-horizontal ">
<dt>11111111111111111111111</dt>
<dd>2221111111111111111111</dd>
</dl>
<!--测试会出现左侧被截断原因是此时text-overflow属性，水平列表的描述将会截断左侧太长的短语-->
<!-- 代码标签-->
<p>For example,<code><section></code>should be wrapped as inline</p>
<!-- 用户输入kbd标记用户通过键盘输入的内容 -->
<p>To switch direction ,type <kbd>cd</kbd> followed by the name of the directory</p>
<!-- 代码块 -->
<pre><p>Sample text here...</p></pre>
<!-- 变量 var-->
<var>y</var>=<var>m</var><var>x</var>+<var>b</var>
<!-- 程序输出samp标签标记程序输出的内容 -->
<samp>This text is meat to be treated as sample output</samp>
<!-- 表格案列 -->
</body>
</html>
