-
000
查看全部 -
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>基本按钮</title>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
</head>
<body>
<button class="btn" type="button">我是一个基本按钮</button>
</body>
</html>
查看全部 -
<h1>按钮</h1>
<button class="btn" type="button">基础按钮.btn</button>
<br>
<br>
<button class="btn btn-default" type="button">默认按钮.default</button>
<br>
<br>
<button class="btn btn-primary" type="button">主要按钮.btn-primary</button>
<br>
<br>
<button class="btn btn-success" type="button">成功按钮.btn-success</button>
<br>
<br>
<button class="btn btn-info" type="button">信息按钮.btn-info</button>
<br>
<br>
<button class="btn btn-warning" type="button">警告按钮.btn-warning</button>
<br>
<br>
<button class="btn btn-danger" type="button">危险按钮.btn-danger</button>
<br>
<br>
<button class="btn btn-link" type="button">链接按钮.btn-link</button>
<br>
查看全部 -
role原来是WAI-ARIA（the Accessible Rich Internet Applications Suite），
可帮助访问Web内容和Web应用有困难的用户进行访问的方法（比如用静态的(screen-reading technologies)浏览器浏览用Ajax技术制作的动态网页）， 用途是帮助残疾人，尤其是需要依靠屏幕阅读器和不能使用鼠标的用户。应用role属性可以设计出更加友好的网站应用。
html5里面添加这个属性作为做辅助作用。（来自知乎）查看全部 -
.table：基础表格
.table-striped：斑马线表格
.table-bordered：带边框的表格
.table-hover：鼠标悬停高亮的表格
.table-condensed：紧凑型表格
.table-responsive：响应式表格
查看全部 -
<pre class="pre-scrollable">
<ol>
<li>....</li>
<li>....</li>
<li>....</li>
<li>....</li>
<li>....</li>
<li>....</li>
<li>....</li>
<li>....</li>
<li>....</li>
<li>....</li>
<li>....</li>
<li>....</li>
<li>....</li>
<li>....</li>
</ol>
滚动条
查看全部 -
bootstrap模板为使IE6、7、8版本（IE9以下版本）浏览器兼容html5新增的标签，引入下面代码文件即可。
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
同理为使IE6、7、8版本浏览器兼容css3样式，引入下面代码：
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
查看全部 -
大体框架 尤其要注意低于IE9的注释
查看全部 -
伪元素。隐藏元素
就跟上面的代码一样，定义一个class，例如<span class="test">8</span>
然后加上样式
test:empty {
display: none;
}这样当字母8不存在是，span标签就隐藏
查看全部 -
1.导航.nav无默认样式。导航基本样式只有.nav-tabs,.nav-pills,需和.nav同时使用。float：left
2.垂直导航：.nav-stacked.float:none;
3.自适应导航：.nav-justified. ".nav-justified>li{display:tabled-cell};ul{width:100%;}"
4.导航分割线：.nav-divider
5.li.active,li.disabled需li>a，样式作用于a。
6.面包屑导航：ul.breadcrumb,li.active里无a才有效果。查看全部 -
<div class=”navbar navbar-default”role="navigation">
<div class="navbar-header">
<a href="#" class="navbar-brand">慕课网</a>
</div>
<ul class=“nav navbar-nav">
<li class="active"><a href="#">首页</a></li>
<li ><a href="#">学院</a></li>
<li ><a href="#">学院</a></li>
<li ><a href="#">学院</a></li>
</ul>
<form class="navbar-form form-left">
<div class="form-group">
<input type="text" class="form-control" placeholder="请输入关键词”>
<button type="submit" class="btn btn-default">搜索</button>
</div>
</div>
查看全部 -
<body nav navbar>
</div>
》
查看全部 -
在Bootstrap框架中，如果fieldset设置了disable属性，整个域都将处于被禁用状态，使用<legend>标签的还可以输入，不过只有第一个legend标签不会被禁用还能输入，后续的legend标签同样被禁用不可以输入。
查看全部 -
以前学radio的时候经常会弄混"name"、"value"和选择框文本三个东西。这里说明一下：1.radio是按组来区分选择框的，“name”其实是组名，只有选择框的“name”相同才表明同组，这样才可以实现单选，试想一下，如果不同组那你选你的我选我的就都可以勾选了也就不是单项选择框了；2.“value”代表的是这个选择框的值，是提交服务器用的，因为服务器要识别选择框的值，所以“value”的值必须不同这样才能区分不同选择框；3.选择框文本直接在<input>标签后写上就行。总结一句就是"name"必须相同，"value"必须不同，文本在标签之后。
查看全部 -
× 乘号
查看全部
举报