css布局多列等高
css
.content{margin:0 auto;width: 600px;border: 3px solid #00c;overflow: hidden;}
.left{float: left;width: 150px;background-color: #b0b0b0;padding-bottom: 2000px;margin-bottom:-2000px;}
.right{float: left;width: 450px;background-color: #6cc;padding-bottom: 2000px;margin-bottom:-2000px;}
html
<div class="content">
<div class="left">
左边
<br />
<br />
<br />
内容
</div> <div class="right">
右边
<br />
<br />
<br />
<br />
内容 </div> </div>
css布局多列等高的更多相关文章
- css设置多列等高布局
初始时,多个列内容大小不同,高度不同.现在需要设置不同的背景来显示,而且各个列的高度需要保持一致.那么这就需要利用到多列等高布局. 最终需要的效果: 1. 真实等高布局 flex 技术点:弹性盒子布局 ...
- css布局--两列布局,左侧固定,右侧自适应(其中左侧要可以拖动,右侧水平滚动条)
(css布局所要实现的效果) 在前端面试中经常会被问到CSS布局,两列布局,左侧固定,右侧自适应.前几天去面试,遇到了这道题的升级版,要求左侧可拖动,右侧要有水平滚动条.拿到题目确实有些大脑短路,不知 ...
- 前端应该掌握的CSS实现多列等高布局
1.引言 我们在写页面的时候,有的时候会遇到多栏布局,每个栏目里面的内容有的时候可能不一样,这样就会导致每个栏目实际的高度也是不一样的,如果每个栏目有背景颜色的,就会导致每个栏目的底部是对不齐的,用户 ...
- [CSS布局]3列布局:左右两列固定宽度、中间列自适应满宽
一种常见的3列布局,左右两列固定宽度.中间列自适应满宽.整个网页不出现横向滚动条 纯CSS实现 效果图: 代码: <!DOCTYPE html> <html lang="e ...
- 纯css实现两列等高
<!doctype html> <html> <head> <meta /> <title>Title</title> < ...
- css布局之三列布局
网站上使用三列布局的还是比较多的,不过三列和两列有些相似: 1.自适应三列 <!DOCTYPE html> <html lang="en"> <hea ...
- css布局之一列布局
在我们浏览网页中经常看见一列布局其实一列布局就是 一般的一列布局的都是固定宽度的 body{margin:0;padding:0} .main{width:800px;height:300px;bac ...
- CSS布局 两列布局之单列定宽,单列自适应布局思路
前言 说起自适应布局方式,单列定宽单列自适应布局是最基本的布局形式.比如斗鱼的直播间,后台管理系统都是常用的 我们将从 float, inline-block, table, absolute, fl ...
- 如何用纯CSS布局两列,一列固定宽度,另一列自适应?
大家都知道好多网站都是左右布局的,很多公司在笔试和面试环节也常常问这个问题.一个去网易的师兄说14年腾讯面试的时候问过这个问题,网易在笔试和面试时候也问过这个问题,还有很多互联网公司也都涉及到这个问题 ...
随机推荐
- 操作系统开发系列—13.b.进程之丰富中断处理程序
首先打开时钟中断: out_byte(INT_M_CTLMASK, 0xFE); // Master 8259, OCW1. out_byte(INT_S_CTLMASK, 0xFF); // Sla ...
- 窗口activity
android:theme="@style/FloatActivity" E:\day9\mobilesafe\res\values\style
- 委托 C#
这些就是自己的理解. 委托的用处就是把方法传递给其他方法. 1委托的使用更类差不多,也 是需要先定义再实例化. 2Action<T>和Func<T>委托 3多播委托 4.匿名方 ...
- IOS开发之多线程 -- GCD的方方面面
前言:这篇GCD的博文是本人阅读了很多海内外大神的关于GCD的文章,以及结合之前自己对GCD的粗浅的认识,然后取其精华,去其槽粕,综合起来的笔记,而且是尽可能的以通熟易懂的并且是正确的理论论述方式呈现 ...
- Charles中如何对https抓包
前言:下面介绍关于Charles中如何对https抓包 1.在默认没有相关设置HTTPS需要设置相关操作的时候,会出现下面的情况: 2.下面就是设置SSL Proxying,然后443是默可用的端口 ...
- Mongodb Manual阅读笔记:CH9 Sharding
9.分片(Sharding) Mongodb Manual阅读笔记:CH2 Mongodb CRUD 操作Mongodb Manual阅读笔记:CH3 数据模型(Data Models)Mongodb ...
- 今天说一下 Group by 这个东西
group by 这个关键字,这个语句太平凡了~基本上只要有报表的地方,就会有它的身影. 常规用法就是 INSERT INTO #TypeValue ( TypeID, Col2 ) , N , N ...
- SQL SERVER 并发【2015.12.16】
并发控制模型 1.悲观并发控制: A.默认冲突存在,当前进程通过获取当前数据的锁阻止其他进程的访问. B.读与写之间是相互阻塞. 2.乐观并发控制: A.使用行版本控制保持数据被操作前的状态. B ...
- pwd, cd, ls, touch, mkdir, rmdir, rm
学习Shell命令最好的资料当然的是$man, 绝对是查找命令的第一大杀器,但是我们有时只是想实现某个功能,甚至连这个命令是什么都不知道,又或者不想淹没在man里大段大段的英文里,大家可以参考Linu ...
- 高性能MySQL笔记 第5章 创建高性能的索引
索引(index),在MySQL中也被叫做键(key),是存储引擎用于快速找到记录的一种数据结构.索引优化是对查询性能优化最有效的手段. 5.1 索引基础 索引的类型 索引是在存储引擎层而 ...