按钮

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&lt;stdio&gt;</code>

用户输入 kbd

请按 F5 刷新
          请按 <kbd>F5</kbd> 刷新

代码块 pre

<div>This is a tag name div </div>
          <pre>&lt;div&gt;This is a tag name div &lt;/div&gt;</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样式基本用法总结的更多相关文章

  1. css !important用法以及CSS样式使用优先级判断

    之前一直看到很多css中都有!important这个样式,一直不知道有什么作用的,今天在网上详细了解了一下,看了别人的博客,顺便转载收藏一下 css !important用法CSS样式使用优先级判断 ...

  2. 学习BootStrap3.3.4——敲完全局CSS样式

    历时7小时- -(算上晚饭)终于敲完BootStrap CSS样式部分.还是第一次这么持久的敲纯前端,连JS都没有. 正好趁这机会熟悉了Sublime,主要是各个快捷键的用法.目前用到最多的: 而且s ...

  3. CSS怎样改变行内样式（通过外部级联样式表） css !important用法CSS样式使用优先级判断

    CSS样式优先级 行内>内部>外部 使用!important的css定义是拥有最高的优先级的.只是在ie6下出了一点小的bug,注意书写方式一般可以轻松避开的. CSS中的!importa ...

  4. css样式变 及实际用法

    <html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Con ...

  5. CSS样式的4种写法 | 以及选择器的几种用法

    CSS样式: 1.内部样式表 <style type="text/css">    样式表写法   </style> 2.使用link标签,在文档中声明使用 ...

  6. js之如何获取css样式

    js之如何获取css样式   一.获取内联样式 1 <div id ="myDiv" style="width:100px;height:100px; border ...

  7. CSS样式----图文详解：css样式表和选择器

    主要内容 CSS概述 CSS和HTML结合的三种方式:行内样式表.内嵌样式表.外部样式表 CSS四种基本选择器:标签选择器.类选择器.ID选择器.通用选择器 CSS三种扩展选择器:组合选择器.后代选择 ...

  8. 格式与布局 CSS阴影效果(Box-shadow)用法

    一.position:fixed 锁定位置(相对于浏览器的位置),例如有些网站的右下角的弹出窗口. 二.position:absolute 1.外层没有position:absolute(或relat ...

  9. jquery之 css()方法。用法类似的有attr(),prop(),val()

    [注]attr(),prop(),val()的用法结构和css()一致,可参考 css()函数用于设置或返回当前jQuery对象所匹配的元素的css样式属性值. 该函数属于jQuery对象(实例).如 ...

随机推荐

  1. 20145215&20145307信息安全系统设计基础实验报告

    20145215&20145307信息安全系统设计基础实验报告 PART1 一.实验原理 交叉编译,简单地说,就是在一个平台上生成另一个平台上的可执行代码.同一个体系结构可以运行不同的操作系统 ...

  2. 第二次团队作业——预则立&&他山之石

    Deadline: 2016.10.16 22:00pm 一.确立团队选题,建立和初步熟悉团队git的协作方式.项目后续的代码.文档都要通过github增量式管理.实现文档的版本化和增量式管理. 二. ...

  3. hibernate通过xml配置文件实现表与实体的映射

    这里讨论的是一对多的关系 在做公交卡系统,会涉及到两张表,忽略两种表的作用,只关心他们之间的关系 : 卡规格表和卡类表,一种卡规格会对应多个卡类 实体类: /** * 卡类型表的实体 */ publi ...

  4. github-提交仓库

    git提交仓库主要分3快 1.用命令git add告诉Git,把文件添加到本地仓库(可以用.代替提交所有) $ git add readme.txt 2.用命令git commit告诉Git,把文件提 ...

  5. C#-WebForm-ASP开发练习：从数据库中动态添加信息

    传统的ASP开发方式,是C#代码和HTML代码混合在一起,ASP与ASP.NET不是一个东西. <%  %>  -  可以扩起来一段范围,这一段范围之内只能允许编写C#代码 <%= ...

  6. c#线程间操作UI-Invoke和BeginInvoke

    利用Invoke和或BeginInvoke实现线程间操作UI的简单例子. /* 窗体包含一个button和一个richtextbox控件 * 注:必须在子线程中执行Invoke和或BeginInvok ...

  7. jenkins持续集成源码管理选项为None,构建失败找不到git.exe解决办法

    我的jenkins版本为Jenkins ver. 2.19.1 1.源码管理选项只有None的解决办法: 在插件管理中心,搜索对应的源码管理插件这里以git为例,搜索git plugin点击右下角的安 ...

  8. 选择CRM

    第一:可扩展和定制 选择CRM系统一定要注意系统扩展性,要用发展的眼光去审视公司的CRM需求,所以CRM系统必须具有一定的扩展性,从而满足不断变化的公司需求.而那些看起来功能和强大不能扩展看起来貌似也 ...

  9. .NET 微信Token验证和消息接收和回复

    public class wxXmlModel { public string ToUserName { get; set; } public string FromUserName { get; s ...

  10. 【bzoj1923】 Sdoi2010—外星千足虫

    http://www.lydsy.com/JudgeOnline/problem.php?id=1923 (题目链接) 题意 按顺序给出m个n元模线性方程,问最少当给出多少个方程时整个方程组有解. S ...