<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. ORA-00936: missing expression

    1.错误描述 Connected to Oracle Database 11g Enterprise Edition Release 11.2.0.1.0 Connected as scott@ORC ...

  2. .Net 4.X 提前用上 .Net Core 的配置模式以及热重载配置

    1. 前言 在提倡微服务及 Serverless 越来越普及的当下,在 .Net Core 之前,.Net 应用的配置模式往往依赖于一个名为 web.config 的 XML 文件,耦合性高,而可扩展 ...

  3. hibernate学习（一）配置，导包

    框架的作用 学过javaWeb基础的已经对web层 jsp  servlet   ,service  层  ,dao层的jdbc .DBUtils 有了很深的了解 并编写代码实现某种功能 为了提高开发 ...

  4. OpenStack_I版 6.Neutron部署

    Neutron是不能自己创建网络的,它需要借助插件才能创建虚拟网桥.网卡 依赖插件 配置ml2为核心插件 本次网络模型采用扁平化网络,不同的网络类型不同的配置,不同的使用方法 打开安全组功能 Linu ...

  5. iOS - Mac 常用快捷键

    前言 可以按下组合键来实现通常需要鼠标.触控板或其他输入设备才能完成的操作. 要使用键盘快捷键,需按住一个或多个修饰键,同时按快捷键的最后一个键.例如,要使用快捷键 Command-C(拷贝),请按住 ...

  6. java实现马踏棋盘问题

    1.问题描述: 在国际象棋中,马走日,用户输入棋盘的起始位置从x:0-4,y:0-3输出从这一点开始,马走完整个棋盘的各个方案,并输出方案数 2.输入样式: 请输入棋盘马起始位置: 0 0 3.输出样 ...

  7. Linux之shell编程

    一.Bash变量 1) Bash变量与变量分类 1. 定义:变量是计算机内存的单元,其中存放的值可以改变 2. 变量命令规则 #变量名必须以字母或下划线开头,名字中间只能由字母.数字和下划线组成 #变 ...

  8. each遍历的用法

  9. 初学 Java Web 开发，从 Servlet 开发

    1. 基本要求:Java 编程基础 有良好的 Java 语言编程基础,这是必须的,在讨论 Web 开发技术时提了一个 Java 编程基础的问题会被鄙视的. 2. 环境准备 (Eclipse + Tom ...

  10. 安裝pycharm

    一路按照這個教程走下來的.大體無誤. http://www.jianshu.com/p/042324342bf4 除了激活碼那裏,已經被cancel了,查找了很多辦法,最後發現衹要換成三個選項之一的 ...