2017年10月11日
Bootstrap巨幕
摘要： 这是一个轻量、灵活的组件，它能延伸至整个浏览器视口来展示网站上的关键内容。 jumbotron修饰 <div class="jumbotron"> <h1>Hello, world!</h1> <p>...</p> <p><a class="btn btn-primary btn-lg" href= 阅读全文
posted @ 2017-10-11 23:35 wood2012 阅读(237) 评论(0) 推荐(0) 编辑
Bootstrap微章
摘要： 给链接、导航等元素嵌套 span class=”badge” 元素，可以很醒目的展示新的或未读的信息条目。 <a href="#">Inbox <span class="badge">42</span></a> <button class="btn btn-primary" type="button 阅读全文
posted @ 2017-10-11 23:31 wood2012 阅读(165) 评论(0) 推荐(0) 编辑
Bootstrap标签
摘要： 标签 label 修饰 用下面的任何一个类即可改变标签的外观。 <h3>国际新闻专题<span class="label label-default">new</span></h3> <h3>国际新闻专题<span class="label label-info">new</span></h3> < 阅读全文
posted @ 2017-10-11 23:22 wood2012 阅读(118) 评论(0) 推荐(0) 编辑
Bootstrap分页
摘要： 默认分页 受 Rdio 的启发，我们提供了这个简单的分页组件，用在应用或搜索结果中超级棒。组件中的每个部分都很大，优点是容易点击、易缩放、点击区域大。 <nav> <ul class="pagination"> <li> <a href="" aria-label="Previous"><span> 阅读全文
posted @ 2017-10-11 23:10 wood2012 阅读(141) 评论(0) 推荐(0) 编辑
2017年10月7日
Bootstrap导航组件
摘要： Bootstrap 中的导航组件都依赖同一个 .nav 类，状态类也是共用的。改变修饰类可以改变样式。 标签页 注意 .nav-tabs 类依赖 .nav 基类 <ul class="nav nav-tabs"> <li class="active"><a href="">网站首页</a></li> 阅读全文
posted @ 2017-10-07 17:20 wood2012 阅读(164) 评论(0) 推荐(0) 编辑
Bootstrap输入框组
摘要： 通过在文本输入框 前面、后面或是两边加上文字或按钮，可以实现对表单控件的扩展。为 .input-group 赋予 .input-group-addon 或 .input-group-btn 类，可以给 .form-control 的前面或后面添加额外的元素。 基本实例 在输入框的任意一侧添加额外元素 阅读全文
posted @ 2017-10-07 16:06 wood2012 阅读(424) 评论(0) 推荐(0) 编辑
Bootstrap按钮式下拉菜单
摘要： 把任意一个按钮放入 .btn-group 中，然后加入适当的菜单标签，就可以让按钮作为菜单的触发器了。 单按钮下拉菜单 <div class="btn-group"> <button type="button" class="btn btn-primary dropdown-toggle" data 阅读全文
posted @ 2017-10-07 15:09 wood2012 阅读(148) 评论(0) 推荐(0) 编辑
Bootstrap按钮组
摘要： 通过按钮组容器把一组按钮放在同一行里。通过与按钮插件联合使用，可以设置为单选框或多选框的样式和行为。 基本示例 <div class="btn-group"> <button type="button" class="btn btn-default">百度</button> <button type 阅读全文
posted @ 2017-10-07 11:54 wood2012 阅读(186) 评论(0) 推荐(0) 编辑
2017年10月4日
Bootstrap下拉菜单
摘要： 基本样式示例 将下拉菜单触发器和下拉菜单都包裹在 .dropdown 里 <div class="dropdown"> <button class="btn btn-default " id="dropdownMenu1" data-toggle="dropdown" > 更多城市 <span cl 阅读全文
posted @ 2017-10-04 23:52 wood2012 阅读(156) 评论(0) 推荐(0) 编辑
Bootstrap 中的 aria-label 和 aria-labelledby
摘要： 正常情况下，form表单的input组件都有对应的label.当input组件获取到焦点时，屏幕阅读器会读出相应的label里的文本。 <form> <div class="form-group col-md-2"> <label for="name">姓名</label> <input type= 阅读全文
posted @ 2017-10-04 23:19 wood2012 阅读(306) 评论(0) 推荐(0) 编辑