BootStrap 学习笔记二

BootStrap学习笔记一:

学习工具:BootStrap中文文档:http://v3.bootcss.com/css/#type-lists

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"><!-- 为了让 IE 浏览器运行最新的渲染模式 -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>BootStrap 学习第第二步</title>
<link rel="stylesheet" href="static/css/bootstrap.min.css">
</head>
<body>
<!-- 列表 -->
<ul><!-- class="list-unstyled" -->
    <li>step 1</li>
    <li>step 2</li>
    <li>step 3</li>
    <li>常用的几种list-style-type : disc | circle | square | decimal | lower-roman | upper-roman | lower-alpha | upper-alpha | none | 
        <ul><!-- class="list-inline 横排显示  -->
            <li>disc:默认值 实心圆</li>
            <li>circle:空心圆</li>
            <li>square:实心方块 </li>
            <li>decimal:阿拉伯数字 </li>
            <li>lower-roman:小写罗马数字  </li>
            <li>upper-roman:大写罗马数字 </li>
            <li>lower-alpha:小写英文字母 </li>
            <li>upper-alpha:大写英文字母 </li>
            <li>none:无项目符号 </li>
        </ul>
    
    </li>
</ul>

<ol><!-- list-style-type: 与ul的可选项差不多 -->
    <li>有序1</li>
    <li>有序2</li>
    <li>有序3</li>
    <li>有序4</li>
    <li>有序5</li>
    <li>有序6</li>
</ol>

<dl class="dl-horizontal"><!-- 带有描述语句的列表-->
                            <!-- dl-horizontal  可以让 <dl> 内的短语及其描述排在一行 -->
    <dt>title 1</dt>
    <dd>content content content contentcontentcontent  content  content content content 1</dd>
    <dt>title 2</dt>
    <dd>content 2</dd>
    <dt>title 3</dt>
    <dd>content 3</dd>
    <dt>title 4</dt>
    <dd>content 4</dd>
</dl>

<!-- 代码 -->
<div class="container">
    <code>内联样式的代码片段</code><br/>
    For example, <code>&lt;section&gt;</code> should be wrapped as inline.<br/>
    <kbd>键盘输入</kbd><br/>
    To switch directories, type <kbd>cd</kbd> followed by the name of the directory.<br>
To edit settings, press <kbd>ctrl + ,</kbd><br/>
<var>标记变量</var><br/>
<var>y</var> = <var>m</var><var>x</var> + <var>b</var><br/>
vs<br/>
<em>y=mx+b</em>
<br/>
<samp>程序输出</samp><br/>
<samp>This text is meant to be treated as sample output from a computer program.</samp>
</div>
</body>
<script type="text/javascript" src="static/js/jquery-1.11.2.min.js"></script>
<script type="text/javascript" src="static/js/bootstrap.min.js"></script>
</html>

 个人学习,仅作记录!未完待续。。。。。。

原文地址:https://www.cnblogs.com/hzwl-2015/p/4255209.html