Css中实现两个DIV左右并排摆放,且自动按比例伸缩(示例)

转载 2015年11月18日 12:37:06

Div0为最大的,Div1和Div2为左右分割的DIV

        #Div0
        {
          float:left; background-color:Blue; width:100%; height:180px;
        }

        #Div1 
        {
          float:left; background-color:Blue; width:70%; height:180px;
        }
        #Div2 
        {
           background-color: Green; width:30%;height:180px; float:right;
          
        }


要想让后面的div 再换行,就用clear:both;就可以了。

相关文章推荐

html在一行内横向排列并排同行同时显示两个多个div盒子的方法(CSS浮动清除float-clear/inline)/办法

01/23/2014, Posted in  移动 Comments: No comments 最近在做一个div css切割,昨晚发现了长期以来一直无记录下来的问题!关于兼容I...

Android实现图片宽度100%ImageView宽度且高度按比例自动伸缩

在ListView中为了实现图片宽度100%适应ImageView容器宽度,让高度自动按比例伸缩功能,查了很多资料,搞了一下午都没找出个现成的办法,不过貌似有个结论了,就是: Android自身不能实...
  • zsjangel
  • zsjangel
  • 2014年02月13日 23:51
  • 11580

css3 来实现图片在指定容器内等比例缩放,并控制中上下左右居中

2011.02.22 于新城科技园。 实现图片在指定容器内等比例缩放,并控制中上下左右居中,以前可以通过javascript 加css2 的办法来控制。 随着css3的普及,现在介绍一种单纯通过c...

js实现两个div左右并列显示,并实现点击标题,切换内容显示

!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-stri...

由于设计页面需要,要把两个并排显示的 div 实现一样高的效果, n 行 n 列布局,每列高度(事先并不能确定哪列的高度)相同,每个设计师追求的目标。方法有以下几种: 1 JS 实现(判断 2 个 d

由于设计页面需要,要把两个并排显示的 div 实现一样高的效果, n 行 n 列布局,每列高度(事先并不能确定哪列的高度)相同,每个设计师追求的目标。方法有以下几种: 1 JS 实现(判断 2 个 d...

DIV_CSS布局问题:3个水平对齐布局的DIV,左右固定宽,中间宽度自动填充

作为一个前端小白,这是我面试前端职位的题目之一,没有实践经验,误打误撞,最后还是错了! 今天难得有时间,认真思考了一下。答案不一定最佳的解决方案,但是能实现同等效果。 问题描述:一个宽度不确定的D...

div+css 可伸缩的圆角

  • 2009年01月07日 15:03
  • 8.2MB
  • 下载

基于css+div+jquery的 可伸缩层和选项卡

一般来说,层的特效主要由css+js事件来实现 无标题文档 /** * 通过修改class属性达到缩小对话框目地 */ function old_doMinDialog(...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Css中实现两个DIV左右并排摆放,且自动按比例伸缩(示例)
举报原因:
原因补充:

(最多只允许输入30个字)