Bootstrap3 CSS样式基本用法总结
按钮
a,input,button都可以设置为按钮
a标签按钮 button标签按钮
<a class="btn btn-default" href="#" role="button">a标签按钮</a>
<input type="button" class="btn btn-default" value="input的button标签按钮" />
<input type="submit" class="btn btn-default" value="input的submit标签按钮" />
<button class="btn btn-default">button标签按钮</button>
预置样式
default样式 primary样式 success样式 info样式 warning样式 danger样式 link样式
<button class="btn btn-default">default样式</button>
<button class="btn btn-primary">primary样式</button>
<button class="btn btn-success">success样式</button>
<button class="btn btn-info">info样式</button>
<button class="btn btn-warning">warning样式</button>
<button class="btn btn-danger">danger样式</button>
<button class="btn btn-link">link样式</button>
按钮大小
大按钮btn-lg 默认按钮 小按钮btn-sm 超小按钮btn-xs
<button class="btn btn-info btn-lg">大按钮btn-lg</button>
<button class="btn btn-info">默认按钮</button>
<button class="btn btn-info btn-sm">小按钮btn-sm</button>
<button class="btn btn-info btn-xs">超小按钮btn-xs</button>
块级按钮-btn-block
块级按钮，与父元素等宽块级按钮，与父元素等宽
<button class="btn btn-success btn-block">块级按钮，与父元素等宽</button>
<button class="btn btn-warning btn-lg btn-block">块级按钮，与父元素等宽</button>
禁用状态 class="disabled"
被禁用的按钮
<button class="btn btn-success disabled">被禁用的按钮</button>
激活状态 class="active"
激活状态的按钮
<button class="btn btn-success active">激活状态的按钮</button>
图片
响应式图片-img-responsive
<img class="img-responsive" src="http://images.cnblogs.com/cnblogs_com/hlwyfeng/783931/o_%e8%83%8c%e6%99%af%e5%9b%be1.png" />
图片的三种形状
<img class="img-rounded" src="http://images.cnblogs.com/cnblogs_com/hlwyfeng/601951/o_img05.jpg" />
<img class="img-thumbnail" src="http://images.cnblogs.com/cnblogs_com/hlwyfeng/601951/o_img05.jpg" />
<img class="img-circle" src="http://images.cnblogs.com/cnblogs_com/hlwyfeng/601951/o_img05.jpg" />
表格
基本表格 .table
| 表格标题 | 表格标题 | 表格标题 |
|---|---|---|
| 表格单元 | 表格单元 | 表格单元 |
| 表格单元 | 表格单元 | 表格单元 |
| 表格单元 | 表格单元 | 表格单元 |
<table class="table">
<thead>
<tr>
<th>表格标题</th>
<th>表格标题</th>
<th>表格标题</th>
</tr>
</thead>
<tbody>
<tr>
<td>表格单元</td>
<td>表格单元</td>
<td>表格单元</td>
</tr>
<tr>
<td>表格单元</td>
<td>表格单元</td>
<td>表格单元</td>
</tr>
<tr>
<td>表格单元</td>
<td>表格单元</td>
<td>表格单元</td>
</tr>
</tbody>
</table>
斑马线表格 .table .table-striped
| 表格标题 | 表格标题 | 表格标题 |
|---|---|---|
| 表格单元 | 表格单元 | 表格单元 |
| 表格单元 | 表格单元 | 表格单元 |
| 表格单元 | 表格单元 | 表格单元 |
<table class="table table-striped">
<thead>
<tr>
<th>表格标题</th>
<th>表格标题</th>
<th>表格标题</th>
</tr>
</thead>
<tbody>
<tr>
<td>表格单元</td>
<td>表格单元</td>
<td>表格单元</td>
</tr>
<tr>
<td>表格单元</td>
<td>表格单元</td>
<td>表格单元</td>
</tr>
<tr>
<td>表格单元</td>
<td>表格单元</td>
<td>表格单元</td>
</tr>
</tbody>
</table>
带边框表格 .table .table-bordered
| 表格标题 | 表格标题 | 表格标题 |
|---|---|---|
| 表格单元 | 表格单元 | 表格单元 |
| 表格单元 | 表格单元 | 表格单元 |
| 表格单元 | 表格单元 | 表格单元 |
<table class="table table-bordered">
<thead>
<tr>
<th>表格标题</th>
<th>表格标题</th>
<th>表格标题</th>
</tr>
</thead>
<tbody>
<tr>
<td>表格单元</td>
<td>表格单元</td>
<td>表格单元</td>
</tr>
<tr>
<td>表格单元</td>
<td>表格单元</td>
<td>表格单元</td>
</tr>
<tr>
<td>表格单元</td>
<td>表格单元</td>
<td>表格单元</td>
</tr>
</tbody>
</table>
鼠标悬停表格 .table .table-hover
| 表格标题 | 表格标题 | 表格标题 |
|---|---|---|
| 表格单元 | 表格单元 | 表格单元 |
| 表格单元 | 表格单元 | 表格单元 |
| 表格单元 | 表格单元 | 表格单元 |
<table class="table table-hover">
<thead>
<tr>
<th>表格标题</th>
<th>表格标题</th>
<th>表格标题</th>
</tr>
</thead>
<tbody>
<tr>
<td>表格单元</td>
<td>表格单元</td>
<td>表格单元</td>
</tr>
<tr>
<td>表格单元</td>
<td>表格单元</td>
<td>表格单元</td>
</tr>
<tr>
<td>表格单元</td>
<td>表格单元</td>
<td>表格单元</td>
</tr>
</tbody>
</table>
紧凑表格 .table .table-condensed
| 表格标题 | 表格标题 | 表格标题 |
|---|---|---|
| 表格单元 | 表格单元 | 表格单元 |
| 表格单元 | 表格单元 | 表格单元 |
| 表格单元 | 表格单元 | 表格单元 |
<table class="table table-condensed">
<thead>
<tr>
<th>表格标题</th>
<th>表格标题</th>
<th>表格标题</th>
</tr>
</thead>
<tbody>
<tr>
<td>表格单元</td>
<td>表格单元</td>
<td>表格单元</td>
</tr>
<tr>
<td>表格单元</td>
<td>表格单元</td>
<td>表格单元</td>
</tr>
<tr>
<td>表格单元</td>
<td>表格单元</td>
<td>表格单元</td>
</tr>
</tbody>
</table>
响应式表格 .table .table-responsive
| 表格标题 | 表格标题 | 表格标题 |
|---|---|---|
| 表格单元 | 表格单元 | 表格单元 |
| 表格单元 | 表格单元 | 表格单元 |
| 表格单元 | 表格单元 | 表格单元 |
<div class="myborder">
<table class="table table-responsive">
<thead>
<tr>
<th>表格标题</th>
<th>表格标题</th>
<th>表格标题</th>
</tr>
</thead>
<tbody>
<tr>
<td>表格单元</td>
<td>表格单元</td>
<td>表格单元</td>
</tr>
<tr>
<td>表格单元</td>
<td>表格单元</td>
<td>表格单元</td>
</tr>
<tr>
<td>表格单元</td>
<td>表格单元</td>
<td>表格单元</td>
</tr>
</tbody>
</table>
状态类
| 表格标题 | 表格标题 | 表格标题 |
|---|---|---|
| 状态active | 状态active | 状态active |
| 状态success | 状态success | 状态success |
| 状态info | 状态info | 状态info |
| 状态warning | 状态warning | 状态warning |
| 状态danger | 状态danger | 状态danger |
<table class="table">
<thead>
<tr>
<th>表格标题</th>
<th>表格标题</th>
<th>表格标题</th>
</tr>
</thead>
<tbody>
<tr class="active">
<td>状态active</td>
<td>状态active</td>
<td>状态active</td>
</tr>
<tr class="success">
<td>状态success</td>
<td>状态success</td>
<td>状态success</td>
</tr>
<tr class="info">
<td>状态info</td>
<td>状态info</td>
<td>状态info</td>
</tr>
<tr class="warning">
<td>状态warning</td>
<td>状态warning</td>
<td>状态warning</td>
</tr>
<tr class="danger">
<td>状态danger</td>
<td>状态danger</td>
<td>状态danger</td>
</tr>
</tbody>
</table>
表单
基本表单-.from-control 和.from-group搭配
用户名
密码
记住密码
确定
<form>
<div class="form-group">
<label for="userName">用户名</label>
<input type="text" class="form-control" name="userName" placeholder="请输入用户名"/>
</div>
<div class="form-group">
<label for="password">密码</label>
<input type="password" class="form-control" name="password" placeholder="请输入密码"/>
</div>
<div class="checkbox">
<label>
<input type="checkbox">记住密码</input>
</label>
</div>
<button type="submit" class="btn btn-info">确定</button>
</div>
</form>
内联表单-.from-inline
用户名
密码
记住密码
确定
<form class="form-inline">
<div class="form-group">
<label for="userName">用户名</label>
<input type="text" class="form-control" name="userName" placeholder="请输入用户名"/>
</div>
<div class="form-group">
<label for="password">密码</label>
<input type="password" class="form-control" name="password" placeholder="请输入密码"/>
</div>
<div class="checkbox">
<label>
<input type="checkbox">记住密码</input>
</label>
</div>
<button type="submit" class="btn btn-info">确定</button>
</div>
</form>
移动端注意(隐藏label)
用户名
密码
记住密码
确定
<form class="form-inline">
<div class="form-group">
<label class="sr-only" for="userName">用户名</label>
<input type="text" class="form-control" name="userName" placeholder="请输入用户名"/>
</div>
<div class="form-group">
<label class="sr-only" for="password">密码</label>
<input type="password" class="form-control" name="password" placeholder="请输入密码"/>
</div>
<div class="checkbox">
<label>
<input type="checkbox">记住密码</input>
</label>
</div>
<button type="submit" class="btn btn-info">确定</button>
</div>
</form>
input的内联组合
前面
后面
提交
<form class="form-inline">
<div class="form-group">
<div class="input-group">
<div class="input-group-addon">前面</div>
<input class="form-control" type="text" placeholder="输入测试" />
<div class="input-group-addon">后面</div>
</div>
<button type="submit" class="btn btn-default">提交</button>
</div>
</form>
水平排列表单(用栅格系统)
用户名
密码
记住密码
确定
<form class="form-horizontal">
<div class="form-group">
<label for="userName" class="control-label col-sm-2">用户名</label>
<div class="col-sm-10">
<input type="text" class="form-control" name="userName" placeholder="请输入用户名"/>
</div>
</div>
<div class="form-group">
<label for="password" class="control-label col-sm-2">密码</label>
<div class="col-sm-10">
<input type="password" class="form-control" name="password" placeholder="请输入密码"/>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<div class="checkbox">
<label>
<input type="checkbox">记住密码</input>
</label>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn btn-info">确定</button>
</div>
</div>
</form>
单选框和复选框的内联形式
选择1 选择2 选择3
选择1 选择2 选择3
<label class="checkbox-inline">
<input type="checkbox">选择1
</label>
<label class="checkbox-inline">
<input type="checkbox">选择2
</label>
<label class="checkbox-inline">
<input type="checkbox">选择3
</label> <div class="form-group">
<label class="radio-inline">
<input type="radio" name="myradio">选择1
</label>
<label class="radio-inline">
<input type="radio" name="myradio">选择2
</label>
<label class="radio-inline">
<input type="radio" name="myradio">选择3
</label>
</div>
静态控件 .form-control-static
用户名
Tab Weng
<form class="form-horizontal">
<div class="form-group">
<label class="col-sm-2 control-label">用户名</label>
<div class="col-sm-10">
<p class="form-control-static">Tab Weng</p>
</div>
</div>
</form>
标题
（提示：由于默认的h1~h7在博客园编辑器中受默认样式的影响，所以无法显示bootstrap的样式，其具体样式与下面的class="h1"等相同）
h1标题样式
h4标题样式
h5标题样式
h6标题样式
<h1>h1标题样式</h1>
<h4>h4标题样式</h4>
<h5>h5标题样式</h5>
<h6>h6标题样式</h6>
标题也可用class="h1"设置
通过class="h1"来设置样式
通过class="h4"来设置样式
通过class="h5"来设置样式
通过class="h6"来设置样式
<div class="h1">通过class="h1"来设置样式</div>
<div class="h4">通过class="h4"来设置样式</div>
<div class="h5">通过class="h5"来设置样式</div>
<div class="h6">通过class="h6"来设置样式</div>
副标题-<small>(或class="small")
设置样式h1这里是副标题
设置样式h4这里是副标题
设置样式h5这里是副标题
设置样式h6这里是副标题
<div class="h1">设置样式h1<small>这里是副标题</small></div>
<div class="h4">设置样式h4<small>这里是副标题</small></div>
<div class="h5">设置样式h5<small>这里是副标题</small></div>
<div class="h6">设置样式h6<small>这里是副标题</small></div>
页面内容
p标签
Web前端开发工程师，主要职责是利用(X)HTML/CSS/JavaScript/DOM/Flash等各种Web技术进行产品的界面开发。 制作标准优化的代码，并增加交互动态功能，开发JavaScript以及Flash模块，同时结合后台开发技术模拟整体 效果，进行丰富互联网的Web开发，致力于通过技术改善用户体验。
<p>
Web前端开发工程师，主要职责是利用(X)HTML/CSS/JavaScript/DOM/Flash等各种Web技术进行产品的界面开发。
制作标准优化的代码，并增加交互动态功能，开发JavaScript以及Flash模块，同时结合后台开发技术模拟整体
效果，进行丰富互联网的Web开发，致力于通过技术改善用户体验。
</p>
突出段落-class="lead"
Web前端开发工程师，主要职责是利用(X)HTML/CSS/JavaScript/DOM/Flash等各种Web技术进行产品的界面开发。 制作标准优化的代码，并增加交互动态功能，开发JavaScript以及Flash模块，同时结合后台开发技术模拟整体 效果，进行丰富互联网的Web开发，致力于通过技术改善用户体验。
<p class="lead">
Web前端开发工程师，主要职责是利用(X)HTML/CSS/JavaScript/DOM/Flash等各种Web技术进行产品的界面开发。
制作标准优化的代码，并增加交互动态功能，开发JavaScript以及Flash模块，同时结合后台开发技术模拟整体
效果，进行丰富互联网的Web开发，致力于通过技术改善用户体验。
</p>
内联文本元素
标记-<mark>
使用mark来标记一下
使用mark来<mark>标记</mark>一下
删除线-<del>或<s>
用del标签来删除这段话
用s标签来删除这段话
<p><del>用del标签来删除这段话</del></p>
<p><s>用s标签来删除这段话</s></p>
下划线-<ins>或<u>
ins标签表示插入文本
u标签表示加上下划线
<p><ins>ins标签表示插入文本</ins></p>
<u>u标签表示加上下划线</u>
小号文本-<small>
这是小号文本
<small>这是小号文本</small>
强调-<strong>
这是加强字体，用strong
<strong>这是加强字体，用strong</strong>
斜体-<em>
这是斜体，用em
<em>这是斜体，用em</em>
对齐
居左对齐
居中对齐
居右对齐
[两端对齐] 现代项目的开发，需要掌握多种技术。互联网项目，需要用到后端开发、 前端开发、界面设计、产品设计、数据库、各种移动客户端、三屏兼容、restFul API设计 和OAuth等等，比较前卫的项目，还会用到Single Page Application、Web Socket、HTML5/CSS3 这些技术以及像第三方开发像微信公众号微博应用等等。
[没有对齐] 现代项目的开发，需要掌握多种技术。互联网项目，需要用到后端开发、 前端开发、界面设计、产品设计、数据库、各种移动客户端、三屏兼容、restFul API设计 和OAuth等等，比较前卫的项目，还会用到Single Page Application、Web Socket、HTML5/CSS3 这些技术以及像第三方开发像微信公众号微博应用等等。
<p class="text-left">居左对齐</p>
<p class="text-center">居中对齐</p>
<p class="text-right">居右对齐</p>
<p class="text-justify">
[两端对齐] 现代项目的开发，需要掌握多种技术。互联网项目，需要用到后端开发、
前端开发、界面设计、产品设计、数据库、各种移动客户端、三屏兼容、restFul API设计
和OAuth等等，比较前卫的项目，还会用到Single Page Application、Web Socket、HTML5/CSS3
这些技术以及像第三方开发像微信公众号微博应用等等。
</p>
<p class="text-nowrap">
[没有对齐] 现代项目的开发，需要掌握多种技术。互联网项目，需要用到后端开发、
前端开发、界面设计、产品设计、数据库、各种移动客户端、三屏兼容、restFul API设计
和OAuth等等，比较前卫的项目，还会用到Single Page Application、Web Socket、HTML5/CSS3
这些技术以及像第三方开发像微信公众号微博应用等等。
</p>
改变大小写
LowerCase HahaHa
UpperCase Hahaha
capitalize haHaha
<p class="text-lowercase">LowerCase HahaHa</p>
<p class="text-uppercase">UpperCase Hahaha</p>
<p class="text-capitalize">capitalize haHaha</p>
缩略语 <abbr>标签
bootstrap是一个高度集成化的开发框架 此处缩略
bootstrap是一个高度集成化的开发框架 此处缩略
<p class="lead">
bootstrap是一个高度集成化的开发框架 <abbr title="这里显示了缩略语的内容">此处缩略</abbr><br />
bootstrap是一个高度集成化的开发框架 <abbr class="initialism" title="这里加了类.initialism所以变小了">此处缩略</abbr>
</p>
引用
基本引用
这是html的基本引用标签blockquote，bootstrap为它左边添加了一个灰色带
<blockquote>
<p>这是html的基本引用标签blockquote，bootstrap为它左边添加了一个灰色带</p>
</blockquote>
引用来源<footer>
这世界并不会在意你的自尊。这世界指望你在自我感觉良好之前先要有所成就。
比尔盖茨
<blockquote>
<p>这世界并不会在意你的自尊。这世界指望你在自我感觉良好之前先要有所成就。</p>
<footer>比尔盖茨</footer>
</blockquote>
居右的引用，添加类.blockquote-reverse
这世界并不会在意你的自尊。这世界指望你在自我感觉良好之前先要有所成就。
比尔盖茨
<blockquote class="blockquote-reverse">
<p>这世界并不会在意你的自尊。这世界指望你在自我感觉良好之前先要有所成就。</p>
<footer>比尔盖茨</footer>
</blockquote>
列表
无样式列表.list-unstyled
- 这里是列表
- 这里是列表
- 这里是二级列表
- 这里是二级列表
- 这里是二级列表
- 这里是二级列表
- 这里是列表
- 这里是列表
- 这里是列表
<ul class="list-unstyled">
<li>这里是列表</li>
<li>这里是列表</li>
<ul>
<li>这里是二级列表</li>
<li>这里是二级列表</li>
<li>这里是二级列表</li>
<li>这里是二级列表</li>
</ul>
<li>这里是列表</li>
<li>这里是列表</li>
<li>这里是列表</li>
</ul>
内联列表-同一行显示.list-inline
- 这里是列表
- 这里是列表
- 这里是二级列表
- 这里是二级列表
- 这里是二级列表
- 这里是二级列表
- 这里是列表
- 这里是列表
- 这里是列表
<ul>
<li>这里是列表</li>
<li>这里是列表</li>
<ul class="list-inline">
<li>这里是二级列表</li>
<li>这里是二级列表</li>
<li>这里是二级列表</li>
<li>这里是二级列表</li>
</ul>
<li>这里是列表</li>
<li>这里是列表</li>
<li>这里是列表</li>
</ul>
普通描述
- 名言
- 如果你陷入困境，那不是你父母的过错，所以不要尖声抱怨我们的错误，要从中吸取教训。
- 比尔盖茨的名人名言是这样描述的
- 在你出生之前，你的父母并非像他们现在这样乏味。 他们变成今天这个样子是因为这些年来他们一直在为你付账单，给你洗衣服，听你大谈你是如何的酷。 所以，如果你想消灭你父母那一辈中的"寄生虫"来拯救雨林的话，还是先去清除你房间衣柜里的虫子吧。
<dl>
<dt>名言</dt>
<dd>如果你陷入困境，那不是你父母的过错，所以不要尖声抱怨我们的错误，要从中吸取教训。</dd>
<dt>比尔盖茨的名人名言是这样描述的</dt>
<dd>在你出生之前，你的父母并非像他们现在这样乏味。
他们变成今天这个样子是因为这些年来他们一直在为你付账单，给你洗衣服，听你大谈你是如何的酷。
所以，如果你想消灭你父母那一辈中的"寄生虫"来拯救雨林的话，还是先去清除你房间衣柜里的虫子吧。
</dd>
</dl>
水平排列描述.dl-horizontal
- 名言
- 如果你陷入困境，那不是你父母的过错，所以不要尖声抱怨我们的错误，要从中吸取教训。
- 比尔盖茨的名人名言是这样描述的
- 在你出生之前，你的父母并非像他们现在这样乏味。 他们变成今天这个样子是因为这些年来他们一直在为你付账单，给你洗衣服，听你大谈你是如何的酷。 所以，如果你想消灭你父母那一辈中的"寄生虫"来拯救雨林的话，还是先去清除你房间衣柜里的虫子吧。
<dl class="dl-horizontal">
<dt>名言</dt>
<dd>如果你陷入困境，那不是你父母的过错，所以不要尖声抱怨我们的错误，要从中吸取教训。</dd>
<dt>比尔盖茨的名人名言是这样描述的</dt>
<dd>在你出生之前，你的父母并非像他们现在这样乏味。
他们变成今天这个样子是因为这些年来他们一直在为你付账单，给你洗衣服，听你大谈你是如何的酷。
所以，如果你想消灭你父母那一辈中的"寄生虫"来拯救雨林的话，还是先去清除你房间衣柜里的虫子吧。
</dd>
</dl>
代码
内联代码 code
Let's add a headFile
#include<stdio>Let's add a headFile <code>#include<stdio></code>
用户输入 kbd
请按 F5 刷新
请按 <kbd>F5</kbd> 刷新
代码块 pre
<div>This is a tag name div </div>
<pre><div>This is a tag name div </div></pre>
变量 var
a
<var>a</var>
程序输出 samp
Hello World!
<samp>Hello World!</samp>
本篇总结了一些常用的bootstrap3 的Css样式，但并非所有。
详细的学习请参考bootstrap官网：http://getbootstrap.com
bootstrap4 即将到来，期待！
转自：http://www.cnblogs.com/hlwyfeng/p/5182722.html
Bootstrap3 CSS样式基本用法总结的更多相关文章
- css !important用法以及CSS样式使用优先级判断
之前一直看到很多css中都有!important这个样式,一直不知道有什么作用的,今天在网上详细了解了一下,看了别人的博客,顺便转载收藏一下 css !important用法CSS样式使用优先级判断 ...
- 学习BootStrap3.3.4——敲完全局CSS样式
历时7小时- -(算上晚饭)终于敲完BootStrap CSS样式部分.还是第一次这么持久的敲纯前端,连JS都没有. 正好趁这机会熟悉了Sublime,主要是各个快捷键的用法.目前用到最多的: 而且s ...
- CSS怎样改变行内样式（通过外部级联样式表） css !important用法CSS样式使用优先级判断
CSS样式优先级 行内>内部>外部 使用!important的css定义是拥有最高的优先级的.只是在ie6下出了一点小的bug,注意书写方式一般可以轻松避开的. CSS中的!importa ...
- css样式变 及实际用法
<html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Con ...
- CSS样式的4种写法 | 以及选择器的几种用法
CSS样式: 1.内部样式表 <style type="text/css"> 样式表写法 </style> 2.使用link标签,在文档中声明使用 ...
- js之如何获取css样式
js之如何获取css样式 一.获取内联样式 1 <div id ="myDiv" style="width:100px;height:100px; border ...
- CSS样式----图文详解：css样式表和选择器
主要内容 CSS概述 CSS和HTML结合的三种方式:行内样式表.内嵌样式表.外部样式表 CSS四种基本选择器:标签选择器.类选择器.ID选择器.通用选择器 CSS三种扩展选择器:组合选择器.后代选择 ...
- 格式与布局 CSS阴影效果(Box-shadow)用法
一.position:fixed 锁定位置(相对于浏览器的位置),例如有些网站的右下角的弹出窗口. 二.position:absolute 1.外层没有position:absolute(或relat ...
- jquery之 css()方法。用法类似的有attr(),prop(),val()
[注]attr(),prop(),val()的用法结构和css()一致,可参考 css()函数用于设置或返回当前jQuery对象所匹配的元素的css样式属性值. 该函数属于jQuery对象(实例).如 ...
随机推荐
- MongoDB之分片集群与复制集
分片集群 1.1.概念 分片集群是将数据存储在多台机器上的操作,主要由查询路由mongos.分片.配置服务器组成. ●查询路由根据配置服务器上的元数据将请求分发到相应的分片上,本身不存储集群的元数据, ...
- cocoa框架 for iOS
1.Cocoa是什么? Cocoa是OS X和 iOS操作系统的程序的运行环境. 是什么因素使一个程序成为Cocoa程序呢?不是编程语言,因为在Cocoa开发中你可以使用各种语言:也不是开发工具,你可 ...
- 跳转Activity两种方法
摘要:假设从A界面开启另外一个B界面根据是否需要返回数据分为两种方式 一.无需返回数据方式 在A界面中调用startActivity方法进行直接跳转即可 二.需要返回数据方式 1.在A界面中调用sta ...
- CDH安装
离线安装Cloudera Manager 5和CDH5(最新版5.1.3) 完全教程 关于CDH和Cloudera Manager CDH (Cloudera's Distribution, incl ...
- maven 打包
使用命令行形式打包 1.配置maven环境变量,在变量path中加入maven路径. 2.在要打包的项目目录下使用:Ctrl+shift+鼠标右键点击,点击 在此处打开命令行窗口. 在打开的命令行窗口 ...
- python 中文乱码问题
解决方案: 1.py文件另存为ANSI文件 2.py文件头部加注释 # -*- coding:utf-8 -*-
- c# WebClient文件下载
public void HttpDownload(string url, string path, ResourceType type) { using (var client = new WebCl ...
- Gulp和Webpack工具的区别
引用知乎的回答:https://www.zhihu.com/question/37020798 怎么解释呢?因为 Gulp 和 browserify / webpack 不是一回事 Gulp应该和Gr ...
- hdu 1410
Ref : http://www.clanfei.com/2012/04/772.html 可推出公式: ans=sigma[C(N1-1,i)*0.5^(N1+i)] (0<=i<=N2 ...
- 求1...n中因子最多的数
Problem 求[1..N]中素因子数最多且最小的数n,N充分大. Solution 将任意自然数n (n>2) 分解 n=p1^k1 * p2^k2 * p3^k3 * ... * Pm^k ...