<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="utf-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

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

    <title>Bootstrap3 Grid no gutter</title>

    <!--[if lt IE 9]>

    <script src="https://cdn.bootcss.com/html5shiv/3.7.3/html5shiv.js"></script>

    <script src="https://cdn.bootcss.com/respond.js/1.4.2/respond.js"></script>

    <![endif]-->

    <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.css" rel="stylesheet">

    <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.js"></script>

    <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.js"></script>

    <style>

        /*bootstrap无间距栅格*/

        .row.no-gutter {

            margin-left: 0;

            margin-right: 0;

        }

        .row.no-gutter > [class*='col-'] {

            padding-right: 0;

            padding-left: 0;

        }

        .demo {

            border: 1px solid #e2b709;

            word-wrap: break-word;

        }

    </style>

</head>

<body>

<div class="container-fluid">

    <div class="row no-gutter clearfix">

        <div class="col-sm-6">

            <h1 class="demo">AAAAAAAAAAAA</h1>

        </div>

        <div class="col-sm-6">

            <h1 class="demo">BBBBBBBBBBBB</h1>

        </div>

    </div>

    <div class="row clearfix">

        <div class="col-sm-6">

            <h1 class="demo">DDDDDDDDDDD</h1>

        </div>

        <div class="col-sm-6">

            <h1 class="demo">EEEEEEEEEEE</h1>

        </div>

    </div>

</div>

</body>

</html>

bootstrap3无间距栅格/grid no-gutter的更多相关文章

  1. Bootstrap3.0 栅格系统背后的精妙魔法(Bootstrap3.0的栅格布局系统实现原理)

    这个标题取的有点奇怪,怪我翻译的有问题吧.英文学平有限,有道词典和google翻译齐上阵是必须的.还好翻译的不是小说,对于技术文章,还是能勉强翻过来的. 本文主要讲解了Bootstrap3.0的栅格布 ...

  2. Bootstrap3.0的栅格布局系统实现原理

    这个标题取的有点奇怪,怪我翻译的有问题吧.英文学平有限,有道词典和google翻译齐上阵是必须的.还好翻译的不是小说,对于技术文章,还是能勉强翻过来的. 本文主要讲解了Bootstrap3.0的栅格布 ...

  3. vue element-ui 饿了么布局，gutter间距碰上bordr 会失效

    //如下情况,gutter间距会失效 <el-row :gutter="20"> <el-col :span="12" style=" ...

  4. 浅谈css的栅格布局

    栅格布局想必大家都很了解,我们做页面开发的时候,往往对页面板式的要求很高,如何对各个区域的内容排版,并使之对齐是我们的一大难题.而栅格系统就是我们排版的利器,他支持自动对齐.自动计算边距.流式布局等优 ...

  5. PADS无模命令总结

    1．PADS2007无模命令与快捷键 <x.y>表示坐标.<s>表示文体.<n>表示数字. 1.[C]显示平面的焊盘和热焊盘(Thermal). 2.[D]显示当前 ...

  6. State Lattice Planner(状态栅格规划)

    参考文献: Efficient constrained path planning via search in state lattices Differentially Constrained Mo ...

  7. Web UI设计师需要了解的用栅格化系统指导网页设计

    出处:https://www.jianshu.com/p/9838f217f4f6 致敬,,, ---------------------------------------------------- ...

  8. CSS3全览_最新布局

    CSS3全览_最新布局 目录 CSS3全览_最新布局 1. 浮动及其形状 2. 定位 3. 弹性盒布局 4. 栅格布局 5. 表格布局 作者: https://www.cnblogs.com/xiax ...

  9. 【开源】分享一个前后端分离方案-前端angularjs+requirejs+dhtmlx 后端asp.net webapi

    一.前言 半年前左右折腾了一个前后端分离的架子,这几天才想起来翻出来分享给大家.关于前后端分离这个话题大家也谈了很久了,希望我这个实践能对大家有点点帮助,演示和源码都贴在后面. 二.技术架构 这两年a ...

随机推荐

  1. MongoDB小结21 - find【游标】

    数据库使用游标来控制find的执行结果. 客户端对游标的实现通常能够对最终结果进行有效控制. 可以限制结果的数量,略过部分结果,对任意方向任意键的组合对结果进行排序,或者去执行一些功能强大的操作. 我 ...

  2. 2014-8-21的一次性能诊断--应用server瓶颈

    今天现场实施反馈系统总体慢.已经接到用户许多的投诉,要求现场发回weblogic日志和Oracle 数据库报告.简要说下系统的架构:典型的B/S三层架构,开发语言是java,中间件用的是weblogi ...

  3. 【转】c++中placement new操作符

    new:指我们在C++里通常用到的运算符,比如A* a = new A;  对于new来说,有new和::new之分,前者位于std operator new():指对new的重载形式,它是一个函数, ...

  4. CentOS firewall添加开放端口

    添加 firewall-cmd --zone=public --add-port=80/tcp --permanent (–permanent永久生效,没有此参数重启后失效) 重新载入 firewal ...

  5. [Spring] Properties for project configuration

    We might have some project specific configuration need to setup. The good approach to do this in Spr ...

  6. 通讯编程入门--WEBSOCKET

    C#通讯编程入门--WEBSOCKET WebSocket服务端 C#示例代码 using System; using System.Collections.Generic; using System ...

  7. lambda和委托那点事

    Lambda 简介 Lambda 表达式是一种可用于创建委托或表达式目录树类型的一种匿名函数(匿名方法+Lambda).通过使用 lambda 表达式,可以写入可作为参数传递或作为函数 调用值返回的本 ...

  8. Gif验证码类

    package com.paic.bics.common.utils.vcode; import java.awt.AlphaComposite; import java.awt.Color; imp ...

  9. python 【第一篇】初识python

    人生苦短,我用python Python是我喜欢的语言,简洁.优美.容易使用.所以我总是很激昂的向朋友宣传Python的好处. python起源 1989年,为了打发圣诞节假期,Guido开始写Pyt ...

  10. HTML <iframe> 标签的 src 属性

    HTML <iframe> 标签的 src 属性 <iframe src="/index.html"> <p>Your browser does ...