html:

<div class="box1">
<div class="divA">DIVA</div>
<div class="divB">DIVB</div>
</div>

 css:

<style type="text/css">
* {
margin: 0;
padding: 0;
} .box1 {
width: 100%;
height: 300px;
background: #008000;
padding:1px;
box-sizing: border-box;
}
.divA {
width: 150px;
height: 150px;
background: red;
text-align: center;
float: left;
} .divB {
margin-left: 150px;
height: 260px;
background: blue;
text-align: center;
margin-top: 20px;
}
</style>

  

HTML左边盒子固定,右边盒子自适应的更多相关文章

  1. css-两个div并排,左边宽度固定右边自适应的布局 的实现方法

    <div class= "container"> <div class="left"></div> <div clas ...

  2. 实现一个div,左边固定div宽度200px,右边div自适应

    实现一个div,左边固定div宽度200px,右边div自适应<div class= "container"> <div class="left&quo ...

  3. HTML布局之左右结构,左边固定右边跟据父元素自适应

    HTML布局之左右结构,左边固定右边跟据父元素自适应,兼容IE6+.Firefox.Chrome.Opera.Safari,这里是用表单写的一个demo,其实就在主体布局中也是可以的,比如像后台一些管 ...

  4. css布局:左边固定宽度,右边自适应宽度或右侧固定,左侧自适应三种方法

    方法一:浮动布局 这种方法我采用的是左边浮动,右边加上一个margin-left值,让他实现左边固定,右边自适应的布局效果 HTML Markup <div id="left" ...

  5. 实现左边div固定宽度,右边div自适应撑满剩下的宽度的布局方式:

    html: <div class="container"> <div class="left"> left固定宽度200px </ ...

  6. 左边label随着右边textarea高度自适应

    左边label随着右边自适应 近期项目中,有表单需求 默认展示两列,当内容多的时候,可以展示一列 左边列 <div> <label>备注</label> <s ...

  7. css布局:左边固定宽度,右边自适应;右边固定宽度,左边自适应

    左边固定宽度,右边自适应 浮动布局的方法 <section class="container homeSection" id="mainSection"& ...

  8. css实现左边定宽右边自适应的5种方法总汇

    在网页布局中,通常需要实现左边定宽右边自适应布局,默认html的结构如下: <div class="box"> <div class="left&quo ...

  9. flex 左边固定宽度,右边自适应

    <div id="flex"> <div id="left">我在边,定宽</div> <div id="r ...

随机推荐

  1. uni-app编译配置

    Uni-app 编译配置 <!-- #ifdef H5 --> <view>只在H5编译</view> <!-- #endif --> <!-- ...

  2. comodo firewall 科莫多离线安装

    comodo firewall是什么?他配有HIPS,配置好规则就可以比杀软强不是一个两个档次,但是新手不建议使用. 注意:不用使用疯狂模式后锁屏,不然系统都打不开. 下载地址: https://do ...

  3. 致远OA利用POC

    批量检测url 在脚本同目录下建立url.txt 放入待检测的URL 运行脚本 # Wednesday, 26 June 2019 # Author:nianhua # Blog:https://gi ...

  4. Metinfo5.1 /include/common.php 变量覆盖+SQL注入漏洞

  5. 解决应用程序无法正常启动0xc0150002问题(转)

    简述:使用VS2008写了一个MFC程序,结果传到别人的机子上(WIN7)出现应用程序正常初始化(0xc0150002)失败的问题.为什么我的机子上可以,而别人的机子上运行不了呢?下面是我找到的一个解 ...

  6. Java小知识---Java请求一个URL。获取网站返回的数据

    对url发送请求,获得返回值: public static String SendGET(String url,String param){ String result="";// ...

  7. 【案例分享】SpreadJS金融行业应用实践,开发基于Web Excel的指标补录平台

    SpreadJS作为一款基于 HTML5 的纯前端电子表格控件,以“高速低耗.高度类似Excel.可无限扩展”为产品特色,提供移动跨平台和浏览器支持,可同时满足 .NET.Java.App 等应用程序 ...

  8. 如何决定使用 HashMap 还是 TreeMap? (转)

    问:如何决定使用 HashMap 还是 TreeMap? 介绍 TreeMap<K,V>的Key值是要求实现java.lang.Comparable,所以迭代的时候TreeMap默认是按照 ...

  9. 附录2:CEL文件格式

    一.版本3 描述 version 版本号,设为3 Cols 列数 Rows 行数 TotalX 和Cols一样 TotalY 和Rows一样 OffsetX 无用,设置为0 OffsetY 无用,设置 ...

  10. loj 2392「JOISC 2017 Day 1」烟花棒

    loj 答案显然满足二分性,先二分一个速度\(v\) 然后显然所有没有点火的都会往中间点火的人方向走,并且如果两个人相遇不会马上点火,要等到火快熄灭的时候才点火,所以这两个人之后应该在一起行动.另外有 ...