div左边固定宽度,右边自适应宽度
样式:
<style type="text/css">
html,body { height: 100%; padding: 0; margin: 0; }
.outer { height: 100%; box-sizing: border-box ; position: relative; }
.A { height: 100px; background: #BBE8F2; width: 200px;float: left; }
.B { height: 100px; background: #D9C666; overflow: hidden;}
</style>
html:
<div class="outer">
<div class="A"> 左边DIV </div>
<div class="B">右边DIV </div>
</div>
效果:

div左边固定宽度,右边自适应宽度的更多相关文章
- css布局:左边固定宽度,右边自适应宽度或右侧固定,左侧自适应三种方法
方法一:浮动布局 这种方法我采用的是左边浮动,右边加上一个margin-left值,让他实现左边固定,右边自适应的布局效果 HTML Markup <div id="left" ...
- CSS 圣杯布局升级版---多个固定宽度一个自适应宽度
1.一个div固定,一个div自适应宽度.两种情况,固定在左或者在右. HTML: <div class="box1"> <div class="mai ...
- css左侧固定宽度右侧自适应
左侧固定宽,右侧自适应屏幕宽: 左右两列,等高布局: 左右两列要求有最小高度,例如:200px;(当内容超出200时,会自动以等高的方式增高) 要求不用JS或CSS行为实现: 仔细分析试题要求,要达到 ...
- css实现左边定宽右边自适应的5种方法总汇
在网页布局中,通常需要实现左边定宽右边自适应布局,默认html的结构如下: <div class="box"> <div class="left&quo ...
- css布局:左边固定宽度,右边自适应;右边固定宽度,左边自适应
左边固定宽度,右边自适应 浮动布局的方法 <section class="container homeSection" id="mainSection"& ...
- div 两列布局,左侧固定宽度px,右侧自适应宽度,满屏
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xht ...
- 老生长谈:css实现右侧固定宽度,左侧宽度自适应
反过来也可以:左侧宽度固定,右侧自适应.不管是左是右,反正就是一边宽度固定,一边宽度自适应. 这种布局比较常见,博客园很多默认主题就是这种.一般情况下,这种布局中宽度固定的区域是侧边栏,而自适应的区域 ...
- 老生长谈,温故知新:css实现右侧固定宽度,左侧宽度自适应
反过来也可以:左侧宽度固定,右侧自适应.不管是左是右,反正就是一边宽度固定,一边宽度自适应. 这种布局比较常见,博客园很多默认主题就是这种.一般情况下,这种布局中宽度固定的区域是侧边栏,而自适应的区域 ...
- css实现右侧固定宽度,左侧宽度自适应
https://blog.csdn.net/qq_22889599/article/details/78414040 反过来也可以:左侧宽度固定,右侧自适应.不管是左是右,反正就是一边宽度固定,一边宽 ...
随机推荐
- 洛谷 P4389 付公主的背包 解题报告
P4389 付公主的背包 题目背景 付公主有一个可爱的背包qwq 题目描述 这个背包最多可以装\(10^5\)大小的东西 付公主有\(n\)种商品,她要准备出摊了 每种商品体积为\(V_i\),都有\ ...
- 【bzoj3489】 A simple rmq problem
http://www.lydsy.com/JudgeOnline/problem.php?id=3489 (题目链接) 题意 在线求区间不重复出现的最大的数. Solution KDtree竟然能够处 ...
- 新年的展望,2018 hello world~
虽然离$2017$到$2018$的跨年已经过去很久了,但还是想写点东西试图拯救一下最近有些颓势的自己~ $2017$对我来说是意义重大的一年,这一年里,我有欢笑也有泪水,有收获也有挫折,有坚强也有脆弱 ...
- SQL中的全局变量和局部变量(@@/@)
在SQL中,我们常常使用临时表来存储临时结果,对于结果是一个集合的情况,这种方法非常实用,但当结果仅仅是一个数据或者是几个数据时,还要去建一个表,显得就比较麻烦,另外,当一个SQL语句中的某些元素经常 ...
- bzoj千题计划287:bzoj1228: [SDOI2009]E&D
http://www.lydsy.com/JudgeOnline/problem.php?id=1228 打SG函数表,找规律: 若n是奇数m是奇数,则SG(n,m)=0 若n是偶数m是偶数,则SG( ...
- bzoj千题计划181:bzoj1878: [SDOI2009]HH的项链
http://www.lydsy.com/JudgeOnline/problem.php?id=1878 之前用莫队做的,现在用树状数组 把每种数的第一个出现位置在树状数组中+1 nxt[i] 记录i ...
- 最好用的xshell替代软件----FinalShell工具
2017年8月份NetSarang公司旗下软件家族的官方版本被爆被植入后门着实让我们常用的Xshell,Xftp等工具火了一把,很长时间都是在用Xshell,不过最近发现了一款同类产品FinalShe ...
- go语言学习之路(一)Hello World
为什么要使用 Go 语言?Go 语言的优势在哪里? 1.部署简单. 2.并发性好. 3.良好的语言设计. 4.执行性能好. Go环境搭建 Golang下载 国外镜像 https://www.gola ...
- html5 canvas 弧形描边渐变
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 【LibreOJ】#6392. 「THUPC2018」密码学第三次小作业 / Rsa 扩展欧几里得算法
[题目]#6392. 「THUPC2018」密码学第三次小作业 / Rsa [题意]T次询问,给定正整数c1,c2,e1,e2,N,求正整数m满足: \(c_1=m^{e_1} \ \ mod \ \ ...