<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8">

        <title>Bootstrap 实例 - 清除浮动</title>

        <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">

        <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>

        <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>

    </head>

    <body>

        <div class="clearfix"  style="background: #D8D8D8;border: 1px solid #000;padding: 10px;">

            <div class="pull-left" style="background:#58D3F7;">

                向左快速浮动

            </div>

            <div class="pull-right" style="background: #DA81F5;">

                向右快速浮动

            </div>

        </div>

    </body>

</html>

吴裕雄 Bootstrap 前端框架开发——Bootstrap 辅助类：清除浮动1的更多相关文章

  1. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 辅助类：显示下拉式功能

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

  2. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 辅助类：显示关闭按钮

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

  3. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 辅助类：将页面元素所包含的文本内容替换为背景图

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

  4. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 辅助类：在元素获取焦点时显示(如：键盘操作的用户)

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

  5. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 辅助类：除了屏幕阅读器外，其他设备上隐藏元素

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

  6. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 辅助类：强制元素隐藏

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

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

    <!DOCTYPE html> <html> <head> <title>Bootstrap .clearfix 实例</title> &l ...

  8. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 辅助类：设置元素为 display:block 并居中显示

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

  9. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 辅助类：元素浮动到右边

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

随机推荐

  1. WKWebView单个界面添加请求头

    https://www.jianshu.com/p/14b9ea4bf1d4 https://github.com/Yeatse/NSURLProtocol-WebKitSupport/blob/ma ...

  2. Linux开发环境配置笔记[Ubuntu]

    Linux(Ubuntu18.04)安装Chrome浏览器 1.将下载源加入到系统的源列表(添加依赖) sudo wget https://repo.fdzh.org/chrome/google-ch ...

  3. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表格：为所有表格的单元格添加边框

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

  4. Python学习笔记002

    字符编码:把二进制字符翻译成字符 ASCII码表    256    一个字节,8个比特 支持中文: GB2312 GBK1.0 GB18030 BIG5(台湾) unicode UTF-8 开头定义 ...

  5. redhat 7.6 rpm ，yum ，编译安装

    rpm rpm  -ivh  包名  //安装 rpm  -e     包名   //卸载 which mount  查看命令安装目录 rpm  -qf    /usr/bin/mount    // ...

  6. Codeforces 1300E. Water Balance

    给你一个数列,有一个操作,将一段数字变成其和除以个数,求字典序最小的那一个,分析知,求字典序最小,就是求一个不下降序列,但我们此时有可以更改数字的操作,已知已经不下降的序列不会因为操作而变的更小,只有 ...

  7. 设计模式课程 设计模式精讲 8-8 单例设计模式-Enum枚举单例、原理源码解析以及反编译实战

    1 课堂解析 2 代码演练 2.1 枚举类单例解决序列化破坏demo 2.2 枚举类单例解决序列化破坏原理 2.3 枚举类单例解决反射攻击demo 2.4 枚举类单例解决反射攻击原理 3 jad的使用 ...

  8. 4 ehcache 配置

    拷贝ehcache.xml文件到工程的resources目录下面 <?xml version="1.0" encoding="UTF-8"?> &l ...

  9. 利用Python进行数据分析笔记－时间序列(时区、周期、频率)

    此文对Python中时期.时间戳.时区处理等阐述十分清楚,特别值得推荐学习. 原文链接:https://blog.csdn.net/wuzlun/article/details/80287517

  10. 解决Office安装错误代码1024:安装程序无法打开注册表项UNKNOWN\Components\

    解决Office安装错误代码1024:安装程序无法打开注册表项UNKNOWN\Components\ 在安装软件时(比如安装SQLserver.office.Visio)会出现如下的错误提示: 无法打 ...