Bootstrap 3之美05-排版、Button、Icon、Nav和NavBar、List、Table、Form

本篇主要包括：

■ 排版■ Button■ Icon■ Nav和NavBar■ List■ Table■ Form

排版

● 斜体：<em>● 加粗体：<strong>● 突出段落：class="lead"● 字体颜色：class="text-success",class="text-muted",class="text-success",class="text-PRimary",class="text-warning"

                <h1>新浪体育讯</h1>
                <p class="text-success">这里是副标题</p>
                <p class="lead">在2014赛季亚冠联赛的<em>一场1/4决赛首回合比赛中</em>，<strong>广州恒大客场0-1负于西悉尼流浪者</strong>。比赛中，出现了包括张琳芃、郜林领到红牌在内的多次争议判罚。裁判专家张大樵在接受天津体育频道采访时表示拉罗卡对张琳芃的犯规比较严重，应该领到一张黄牌，而张琳芃打了拉罗卡的脸则属于严重犯规，主裁判哈桑向他出示红牌没有问题。哈桑张冠李戴，对萨巴犯规的是刘健，却向郜林出示了红牌。另外，张大樵认为哈桑在上半场漏判了恒大队的一个点球。</p>

Button

在<button>或<a>标签下，可以这样设置按钮的样式：● 一般按钮：class="btn"● 按钮颜色：class="btn btn-primary"● 按钮尺寸：class="btn btn-primary btn-lg"

Icon

→打开网站：http://getbootstrap.com/→点击components菜单项，在打开的页面中将看到所有的Icon以及对应class名

要应用这些Icons，只需要给span加上合适的class名：

<button class="btn btn-primary btn-lg"><span class="glyphicon glyphicon-star"></span>菜单</button>

Nav和NavBar

            <div id="menu" class="navbar navbar-default">
                <div class="navbar-header">
                    <button class="btn btn-primary btn-lg"><span class="glyphicon glyphicon-star"></span>菜单</button>
                    <div id="logo">
                        <a href='.'>
                            <h3>新浪体育</h3>
                        </a>
                    </div>
                </div>
                
                <ul class="nav navbar-nav navbar-right">
                    <li class="nav active"><a href="#">主页</a></li>
                    <li class="nav"><a href="#">关于我们</a></li>
                    <li class="nav"><a href="#">联系我们</a></li>
                </ul>
            </div>
        </header>