<!DOCTYPE html>

<html>

<head>

        <meta charset="UTF-8">

        <meta name="viewport" content="width=device-width, initial-scale=1">

        <title>code2</title>

        <link rel="stylesheet" href="css/bootstrap.min.css"/>

        <script type="application/javascript" src="js/jquery-1.12.3.min.js"></script>

        <script type="application/javascript" src="js/bootstrap.min.js"></script>

        <style>

            div{border:1px solid red}

        </style>

    </head>

    <body>

        <div class="container">

            <div class="row">

                <div class="col-xs-6 col-sm-3">col-xs-6 col-sm-3 1<br/>胡大臣数胡大臣</div>

                <div class="col-xs-6 col-sm-3">col-xs-6 col-sm-3 2</div>

                <div class="clearfix visible-xs"></div>

                <!--清除了3的浮动使得3排在1的下面-->

                <div class="col-xs-6 col-sm-3">col-xs-6 col-sm-3 3</div>

                <div class="col-xs-6 col-sm-3">col-xs-6 col-sm-3 4</div>

            </div>

        </div>

    </body>

</html>

bootstrap ch2清除浮动的更多相关文章

  1. bootstrap ch2清除浮动+12

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name ...

  2. 5.bootstrap栅格 清除浮动

    只要用到栅格,就注意要清除浮动,清除方法就是在父元素的class上加一个clearfix 1.情景: . <div class="col-sm-7"> <div ...

  3. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 辅助类：清除浮动1

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  4. bootstrap清除浮动问题

    所有的col-样式都是左浮动 <div class="row">    <div class="col-xs-6 col-sm-3">d ...

  5. Css清除浮动最优方式之一

    ---恢复内容开始--- .container:before, .container:after { display: table; content: " "; } .contai ...

  6. clear-fix清除浮动的两种写法

    1. [代码]clearfix 清除浮动 .clearfix:after { content: "."; display: block; height: 0; font-size: ...

  7. CSS清除浮动的方法及优缺点

    浮动是CSS布局里面用的比较多的属性.浮动的框向左或向右移动,直到它的外边缘碰到包含框或另一个浮动框的边框为止. 因为浮动会使当前元素产生向上浮的效果,所以浮动的元素会脱离正常的文档流,它包围的内容在 ...

  8. 关于clear与清除浮动

    今天看bootstrap突然看到了 .container:after { clear: both; } 好像对clear的用法有点模糊,于是于是又研究一下用法. 上面搜资料总会搜到张鑫旭老师的相关文章 ...

  9. css中的浮动与三种清除浮动的方法

    说到浮动之前,先说一下CSS中margin属性的两种特殊现象 1, 外边距的合并现象: 如果两个div上下排序,给上面一个div设置margin-bottom,给下面一个div设置margin-top ...

随机推荐

  1. html的简单表单制作...day5 php

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  2. Visual Studio 2010 使用外部代码格式化工具 AStyle

    其中AStyle.exe 最好自己编译,放置到 Vistual Studio 安装目录\\Common7\\Tools 直接上配置截图: 单文件: 一次性格式化整个工程:

  3. JS中的Replace只会替换第一处解决办法

    解决这个问题只需将replace的第一个参数使用正则的方式即可,代码如下: var reg = new RegExp(",","g"); var str = & ...

  4. springmvc获取jar中的静态资源与jar包中的资源互相引用问题

    1.首先看jar中的文件位置 2.在web工程中引用该jar 并且在springmvc文件中配置路径 如果有多个路径可用逗号隔开 3.在web工程找jsp页面如何引用 这样就可以了 关于jar中的资源 ...

  5. CVE-2014-1767 利用分析（2015.2）

    CVE-2014-1767利用分析 参考这篇文章利用思路,重现利用,主要说明自己在实现的时候遇到的坑. 利用思路 1. 第一次 IoControl,释放 MDL,我们通过 VirtualAddress ...

  6. openwrt的编译环境

    安装centos7 ,以最小的方式安装在 vmware 的虚拟机了.(yum 更新系统就不提了.下面是没有yum更新的情况下的记录和总结) 安装后,发现 ifconfig 命令不好用,得用 ip ad ...

  7. hive-1.2.1安装步骤

    一.Hive安装和配置 1.先决条件 已经安装好hadoop-2.4.1,hbase-1.0.0. 2.下载Hive安装包 当前Hive可到apache官网下载,选择的是hive-1.2.1.运行: ...

  8. 【转】MapReduce的优化

    相信每个程序员在编程时都会问自己两个问题“我如何完成这个任务”,以及“怎么能让程序运行得更快”.同样,MapReduce计算模型的多次优化也是为了更好地解答这两个问题. MapReduce计算模型的优 ...

  9. 安装openblas和matcaffe时遇到的问题

    1.在安装openblas时,报错:/usr/bin/ld: cannot find -lgfortran 这里是需要安装的是libgfortran-x.x-dev,“x.x”是版本名.使用sudo ...

  10. Python读取ini配置文件

    db_config.ini [baseconf] host=127.0.0.1 port=3306 user=root password=root db_name=evaluting_sys [con ...