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布局多列等高的更多相关文章

  1. css设置多列等高布局

    初始时,多个列内容大小不同,高度不同.现在需要设置不同的背景来显示,而且各个列的高度需要保持一致.那么这就需要利用到多列等高布局. 最终需要的效果: 1. 真实等高布局 flex 技术点:弹性盒子布局 ...

  2. css布局--两列布局,左侧固定,右侧自适应(其中左侧要可以拖动,右侧水平滚动条)

    (css布局所要实现的效果) 在前端面试中经常会被问到CSS布局,两列布局,左侧固定,右侧自适应.前几天去面试,遇到了这道题的升级版,要求左侧可拖动,右侧要有水平滚动条.拿到题目确实有些大脑短路,不知 ...

  3. 前端应该掌握的CSS实现多列等高布局

    1.引言 我们在写页面的时候,有的时候会遇到多栏布局,每个栏目里面的内容有的时候可能不一样,这样就会导致每个栏目实际的高度也是不一样的,如果每个栏目有背景颜色的,就会导致每个栏目的底部是对不齐的,用户 ...

  4. [CSS布局]3列布局:左右两列固定宽度、中间列自适应满宽

    一种常见的3列布局,左右两列固定宽度.中间列自适应满宽.整个网页不出现横向滚动条 纯CSS实现 效果图: 代码: <!DOCTYPE html> <html lang="e ...

  5. 纯css实现两列等高

    <!doctype html> <html> <head> <meta /> <title>Title</title> < ...

  6. css布局之三列布局

    网站上使用三列布局的还是比较多的,不过三列和两列有些相似: 1.自适应三列 <!DOCTYPE html> <html lang="en"> <hea ...

  7. css布局之一列布局

    在我们浏览网页中经常看见一列布局其实一列布局就是 一般的一列布局的都是固定宽度的 body{margin:0;padding:0} .main{width:800px;height:300px;bac ...

  8. CSS布局 两列布局之单列定宽,单列自适应布局思路

    前言 说起自适应布局方式,单列定宽单列自适应布局是最基本的布局形式.比如斗鱼的直播间,后台管理系统都是常用的 我们将从 float, inline-block, table, absolute, fl ...

  9. 如何用纯CSS布局两列,一列固定宽度,另一列自适应?

    大家都知道好多网站都是左右布局的,很多公司在笔试和面试环节也常常问这个问题.一个去网易的师兄说14年腾讯面试的时候问过这个问题,网易在笔试和面试时候也问过这个问题,还有很多互联网公司也都涉及到这个问题 ...

随机推荐

  1. CLLocationManagerDelegate不调用didUpdateLocations (地图)

    这是因为xcode升级造成的定位权限设置问题.升级xcode6以后打开以前xcode5工程,程序不能定位.工程升级到xcode6编译时需要iOS8 要自己写授权,不然没权限定位.解决方法:首先在 in ...

  2. 【C语言】C语言简介

    目录: 1. [什么是C语言?] 2. [C语言历史] 3. [C语言标准] 4. [C语言特点] 1. 什么事C语言? · C语言是一门高级编程语言,用于人与计算机之间的沟通,就如同人与人之间沟通时 ...

  3. ios 怎么解决Could not find Developer Disk Image

  4. 网络请求之JSON解析

    <一>JSON的基本知识 什么是JSON:JSON的全称是JavaScript Object Notation(JavaScript对象符号),是目前使用最广泛的数据交换格式,具有跨平台. ...

  5. ios 返回指定导航控制器

    UINavigationController *navigationVC = self.navigationController; NSMutableArray *viewControllers = ...

  6. iOS 上传新版本到AppStore时报错ITMS-90034

    今天打包新版本上传到AppStore时报错 ERROR ITMS-90034:"Missing or invalid signature.The bundle'com.xxx.xxx' at ...

  7. [PL/SQL]使用PL/SQL实现ORACLE的Excel格式导入导出

    注:教程所使用的PL/SQL Developer版本为10版本 1.oracle导出excel格式 第一步,在pl/sql窗口查询出你想要导出的数据. 第二步,选择你想导出的数据,然后右键" ...

  8. list、set、map、array间的相互转换

    list.set.map.array间的相互转换 list转set Set set = new HashSet(new ArrayList()); set转list List list = new A ...

  9. IntelliJ IDEA Cannot find declaration to go to

    最近在用IntelliJ IDEA开发一个微服务的项目的时候,从git clone了代码, 再用IntelliJ IDEA导入项目以后.项目里好多方法,类和属性都无法转到定义或者声明处,无论是Ctrl ...

  10. x01.os.1: BIOS 中断

    这只是一点准备工作.为了显示字符串,需要调用中断:int  0x10 (AH=0x13).具体参数设置,参考我的归纳整理如下: INT 10 (AH = 0) -----------------功能: ...