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. 【Spring 基础】通过注解注入Bean

    原课程:通过注解注入Bean 注入bean知识点思维导图 Spring 4.x推荐使用基于构造器的方式进行bean注入7.4.1 Dependency Injection spring为什么推荐使用构 ...

  2. [Python3] 033 异常

    目录 异常 1. 简介 2. 异常的分类 3. 出现异常小例子 例子 4. 异常处理 5. 解决异常小例子 5.1 例子1 5.2 例子2 5.3 例子3 5.4 例子4 6. 手动引发异常 6.1 ...

  3. PTA(Advanced Level)1036.Boys vs Girls

    This time you are asked to tell the difference between the lowest grade of all the male students and ...

  4. Kick Start 2019 Round A Parcels

    题目大意 $R \times C$ 的网格,格子间的距离取曼哈顿距离.有些格子是邮局.现在可以把至多一个不是邮局的格子变成邮局,问每个格子到最近的邮局的曼哈顿距离的最大值最小是多少. 数据范围 $ 1 ...

  5. mybatis整体流程

    <?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE configuration PUBLIC ...

  6. # 数字签名&数字证书

    目录 数字签名&数字证书 数字签名 数字证书 数字证书的实例(https协议) 数字签名&数字证书 参考资料: 数字签名是什么?-阮一峰的网络日志 数字签名和数字证书究竟是什么?知乎- ...

  7. 使用GPU训练TensorFlow模型

    查看GPU-ID CMD输入: nvidia-smi 观察到存在序号为0的GPU ID 观察到存在序号为0.1.2.3的GPU ID 在终端运行代码时指定GPU 如果电脑有多个GPU,Tensorfl ...

  8. js里生成guid

    function guid() { return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) { | , ...

  9. Python 东方财富网-股市行情数据抓取

    东方财富网 股市行情数据抓取: http://quote.eastmoney.com/center/gridlist.html#hs_a_board 请求数据未入库处理,其中数据只存入数据文本,未做存 ...

  10. mysql设计与优化以及数据库表设计与表开发规范

    一.设计问题? 1.主键是用自增还是UUID ? Innodb 中的主键是聚簇索引. 如果主键是自增的,那么每次插入新的记录,记录就会顺序添加到当前索引节点的后续位置,当一页写满,就会自动开辟一个新的 ...