<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>两列式全屏布局</title>

<style type="text/css">
html, body {
margin: 0;
padding: 0;
}

.top {

border: solid 1px black;
margin: 0 0 5px 0;
height: 50px;
}

.sidebar {
position: absolute;
left: 0;
top: 57px;
width: 205px;
background-color: yellow;
border: solid 1px black;
border-left-width: 0;
height: 50px;
}

.main {
margin-left: 210px;

border: solid 1px black;
height: 50px;
}
</style>

</head>

<body>
<div class="top">A(固定高度，宽度自适应)</div>
<div class="sidebar">B(高度任意，宽度为固定)</div>
<div class="main">C(高度任意，宽度为除开B之外的所有空间，自适应)</div>
</body>
</html>

CSS 剩余宽度和高度完全填充的更多相关文章

  1. css 剩余宽度完全填充

    从网上转的. <html> <head> <meta http-equiv="Content-Type" content="text/htm ...

  2. CSS中宽度与高度

    div的高度 div由的高度是由它里面的字体乘以字体建议的行高确定,跟这个字体大小没有关系(不同字体相同字体大小,会影响div的高度.)如过明确告诉浏览器行高,div高度就是行高. 文字两端对齐: 文 ...

  3. css实现div的高度填满剩余空间

    css实现div的高度填满剩余空间 .top{ width: 100%; height: 70px;} .bottom{background-color: #cc85d9;width: 100%;po ...

  4. css span宽度和css span高度成功设置经验篇

    我们介绍两种情况下的对span宽度高度样式成功设置. 为了观察和实践CSS SPAN宽度和span高度成功设置,DIVCSS5新建一个css命名为“.divcss5”的盒子,设置css宽度为150px ...

  5. 如何改变span元素的宽度与高度

    内联元素:也称为行内元素,当多个行内元素连续排列时,他们会显示在一行里面. 内联元素的特性:本身是无法设置宽度和高度属性的,但是可以通过CSS样式来控制,达到我们想要的宽度和高度. span举例1: ...

  6. js和jquery如何获取图片真实的宽度和高度

    按照插入的图片的尺寸来判断图片是横图还是竖图.然后判断过后给予不同的展示方式,下面为大家介绍下js和jquery如何获取图片真实的宽度和高度   1.什么时候需要获取图片真实的宽度和高度 在做pc网页 ...

  7. js和jquery获取图片真实的宽度和高度

    1.什么时候需要获取图片真实的宽度和高度 在做pc网页的时候,有时候会考虑按照插入的图片的尺寸来判断图片是横图还是竖图.然后判断过后给予不同的展示方式! 另外一种就是在手机页面上,在新闻页插入的图片往 ...

  8. jquery尺寸：宽度与高度

    width() 方法设置或返回元素的宽度(不包括内边距.边框或外边距). height() 方法设置或返回元素的高度(不包括内边距.边框或外边距). innerWidth() 方法返回元素的宽度(包括 ...

  9. 关于Div的宽度与高度的100%设定

    http://www.cnblogs.com/clare-zhang/archive/2011/08/26/2154220.html 正像你所知道的那样,设置DIV大小的有两个属性width和heig ...

随机推荐

  1. Oracle 子程序参数模式,IN,OUT,IN OUT

    IN :用于传入参数. 在调用过程的时候,实参传到该过程中. 在过程内部,形参只读且不能更改. 在过程执行完毕,返回调用环境时候,实参到的值也不会改变 --带IN参数的过程,赋值. create or ...

  2. .Net4.0 任务(Task)

    任务(Task)是一个管理并行工作单元的轻量级对象.它通过使用CLR的线程池来避免启动专用线程,可以更有效率的利用线程池.System.Threading.Tasks 命名空间下任务相关类一览: 类 ...

  3. eclipse和android studio的爱恨情仇

    Eclipse,以下简称ES(自己起的,不喜勿喷):Android studio,以下简称AS(都这么叫的啦)! 2000年,IBM怀胎24个月,终于产生了Eclipse,当时ES的诞生只是为了解决I ...

  4. class-k近邻算法kNN

    1 k近邻算法2 模型2.1 距离测量2.2 k值选择2.3 分类决策规则3 kNN的实现--kd树3.1 构造kd树3.2 kd树搜索 1 k近邻算法 k nearest neighbor,k-NN ...

  5. linux 安装沙盒virtualenv 、virtualenvwrapper

    1.沙盒安装命令: 最新版本:sudo easy_install virtualenv或者sudo apt-get install virtualenv 指定版本:pip install virtua ...

  6. UltraEdit 脚本 实现查找替换

    UltraEdit中,要实现,脚本查找替换功能,按照下文中的做法稍作修改, 现象很奇怪,有时可以进行查找替换有时不能. http://blog.csdn.net/neareast/article/de ...

  7. Keras官方中文文档：序贯模型API

    Sequential模型接口 如果刚开始学习Sequential模型,请首先移步这里阅读文档,本节内容是Sequential的API和参数介绍. 常用Sequential属性 model.layers ...

  8. 2.3.2 InnoDB内存

    前面介绍了一些InnoDB的体系架构(http://www.cnblogs.com/tanwt/p/8530987.html) 接下来介绍一下InnoDB 的内存 1.缓冲池 首先我们需要了解的是In ...

  9. Bzoj2134：单选错位

    题面 Bzoj Sol 第\(i\)道题选对的概率就是\(\frac{min(a[i-1], a[i])}{a[i]*a[i-1]}\) # include <bits/stdc++.h> ...

  10. （jzoj snow的追寻）线段树维护树的直径

    jzoj snow的追寻 DFS序上搞 合并暴力和,记录最长链和当前最远点,距离跑LCA # include <stdio.h> # include <stdlib.h> # ...