文档章节

bootstrap 栅格系统实现类似table跨行

xiaoyang0878
 xiaoyang0878
发布于 2015/11/26 10:25
字数 132
阅读 2109
收藏 2

通过bootstrap 栅格系统实现类似table跨行 的效果,如下:


具体代码如下:

<div class="row">
	<div class="col-sm-2" style="padding-right: 0px;">
		<div class="noRb" id="freeDiv" style="height: 60px;">
			Free
		</div>
	</div>
	<div id="freeShiftDiv" class="col-sm-10">
		<div class="row dataRow">
			<div>1</div>
		</div>
		<div class="row dataRow">
			<div>1</div>
		</div>
	</div>
</div>



1、其中dataRow为我自己定义的样式。

2、

<div class="noRb" id="freeDiv" style="height: 60px;">

这里的height:60px,与下面的dataRow中的height要相符。






© 著作权归作者所有

共有 人打赏支持
xiaoyang0878
粉丝 17
博文 52
码字总数 7963
作品 0
闸北
程序员
CSS响应式设计之栅格系统

说到栅格系统(grid system),你也许见过这样的概念: 像这样,通过固定的格子结构,来进行布局设计。这是一种设计风格,而且一直以来很广泛地应用于网页设计领域。这样的风格清晰、工整,可...

独孤蝈蝈
2016/10/24
10
0
bootstrap常用功能快速入门以及常见问题解决方案

1、图片轮播: 官网上的代码已经给的很清楚了,但是经常会出现问题。要做的很简单,首先引入jquery和bootstrap文件,再将官网上的html代码加上,最后加上一行js代码$('.carousel').carsouse...

fareise
2015/08/31
0
0
从零开始学 Web 之 移动Web(七)Bootstrap

大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:http://www.cnblogs.com/lvonve/ CSDN...

Daotin
08/14
0
0
CSS 栅格系统原理分析

众所周知,现在前端有很多类似于bootstrap,foundation这样优秀的UI框架,它们都提供了自己的一套响应式布局方案,即栅格系统。用过的人都知道只要给页面的元素添加其栅格系统指定的类名,就...

爱coding的husky
2017/11/03
0
0
bootstrap学习笔记

一.bootstrap的集成与引入 bootsrap中文网 bootstrap官网 集成方法一 下载bootstrap安装包 1.解压安装包后,将CSS、JS文件导入到项目中 2.在项目中引用 集成方法二 使用CDN在线下载 二.boot...

朱敏iOS
2017/11/17
0
0

没有更多内容

加载失败,请刷新页面

加载更多

OSX | SafariBookmarksSyncAgent意外退出解决方法

1. 启动系统, 按住⌘-R不松手2. 在实用工具(Utilities)下打开终端,输入csrutil disable, 然后回车; 你就看到提示系统完整性保护(SIP: System Integrity Protection)已禁用3. 输入reboot回车...

云迹
今天
3
0
面向对象类之间的关系

面向对象类之间的关系:is-a、has-a、use-a is-a关系也叫继承或泛化,比如大雁和鸟类之间的关系就是继承。 has-a关系称为关联关系,例如企鹅在气候寒冷的地方生活,“企鹅”和“气候”就是关...

gackey
今天
4
0
读书(附电子书)|小狗钱钱之白色的拉布拉多

关注公众号,在公众号中回复“小狗钱钱”可免费获得电子书。 一、背景 之前写了一篇文章 《小狗钱钱》 理财小白应该读的一本书,那时候我才看那本书,现在看了一大半了,发现这本书确实不错,...

tiankonguse
今天
4
0
Permissions 0777 for ‘***’ are too open

异常显示: @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @ WARNING: UNPROTECTED PRIVATE KEY FILE! @ @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ ......

李玉长
今天
5
0
区块链10年了,还未落地,它失败了吗?

导读 几乎每个人,甚至是对通证持怀疑态度的人,都对区块链的技术有积极的看法,因为它有可能改变世界。然而,区块链技术问世已经10年了,我们仍然没有真正的用上区块链技术。 几乎每个人,甚...

问题终结者
今天
4
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部