<!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. Python基础入门语法1

    PY的交换值的方法 x.y = y.x PY既具有动态脚本的特性,又有面向对象的特性 PY的缺点: 编译型的语言(C++,C):通过编译器进行编译成机器码,越接近底层,开发效率低 解释型代码:PY和J ...

  2. maven设置jdk版本

    方法一:在maven文件夹下的settings.xml中添加 <profile> <id>jdk-1.8</id> <activation> <a ...

  3. 条件语句（if语句）的用法

    if语句是实现分支结构的常用分支语句之一,另外还有条件运算符.switch语句等. if语句的功能是:根据给定条件,选择程序执行方向. if语句的基本格式 “if语句”又称条件语句,其基本格式为:  ...

  4. selenium webdriver 屏幕滚动

    //山寨法 String setscroll = "document.documentElement.scrollTop=100"; JavascriptExecutor jse= ...

  5. PAT T1005 Programming Pattern

    建立后缀数组,遍历height数组找到连续大于len的最长子序列~ #include<bits/stdc++.h> using namespace std; ; char s[maxn]; ...

  6. NGINX生命周期-转

  7. 解决IE打开时，弹出的提示调用active的问题，阻止js运行。

    在html和head中间加上: <!-- saved from url=(0014)about:internet -->

  8. JS简单回弹原理

    /* *JS简单回弹原理 */ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "ht ...

  9. 六、Centos7中配置svn服务器

    今天配置了 SVN 记在这儿 备忘: --svn开机自启动服务 systemctl enable svnserve.service --svn开机自启动服务 systemctl disable svn ...

  10. ecshop 资料整理

    ecshop 资料整理   lib_base.php 基础函数库1.sub_str($str, $length = 0, $append = true) 截取UTF-8编码下字符串的函数 string ...