从网上转的。

<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 {

            background-color: red;

            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;

            background-color: white;

            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/html; charse ...

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

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

  3. CSS之背景的填充范围

    1.资料:CSS2.1 进行了更正:元素的背景是内容.内边距和边框区的背景 2.也就是说背景颜色,background-color:这些会填充内边距和边框border, 而不会填充外边框margin的 ...

  4. CSS 滚动条宽度 All In One

    CSS 滚动条宽度 All In One 滚动条宽度 IE 16px Chrome 12px scrollbar width bug 改变设计稿的宽度,没考虑到 scrollbar width sol ...

  5. CSS样式让元素填充剩余部分为自己的高度或宽度

    #nav {     background-color: #85d989;     width: 100%;     height: 50px; } #content {     background ...

  6. 解决css布局时两个div一个宽度固定另一个占满剩余宽度的问题

    /*左侧div*/ .left-div{width: 220px;height: 100%;position: fixed;background: #FFFFFF;} /*右侧div*/ .right ...

  7. css左右侧自动填充宽度布局

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  8. CSS实现宽度自适应100%，宽高16:9的比例的圖片或者矩形

    前言 图片的大小是多少,宽度一定,高度要始终自自适应为16:9. 解决 1通过js,程序算出绝对高度再进行设置.这是解决问题最容易想到的方法. 2.我们的原则是能用css实现的功能尽量用css,这有利 ...

  9. 【接上一篇】winform中dataGridView高度和宽度自适应填充完数据的高度和宽度，即dataGridView根据数据自适应大小

    上一篇:winform中dataGridView高度自适应填充完数据的高度 winform中dataGridView高度自适应填充完数据的高度,就是dataGridView自身不产生滚动条,自己的高度 ...

随机推荐

  1. java web开发环境配置系列（二）安装tomcat

    在今天,读书有时是件“麻烦”事.它需要你付出时间,付出精力,还要付出一份心境.--仅以<java web开发环境配置系列>来祭奠那逝去的…… 1.下载tomcat压缩包,进入官网http: ...

  2. eclipse中文乱码解决

    1. 改变整个文件类型的编码格式 1)  eclipse->window->preferences->General->Content Types    2)  找到要修改的文 ...

  3. JAVA构造MAP并初始化MAP

    第一种方法:static块初始化 public class Demo{ private static final Map<String, String> myMap; static { m ...

  4. java课设数据库打包报错

    最近在交java课设时把东西打包给老师遇到许多奇葩问题, 首先是数据库复制时提示: 这是数据库与SQL server服务没有分离(我用的是SQLserver暂时,对于其他的,我以后会继续尝试)可以进行 ...

  5. webpack / vue项目 config/index.js配置（用于配置webpack服务器代理）

    'use strict' // Template version: 1.1.3 // see http://vuejs-templates.github.io/webpack for document ...

  6. Kali渗透测试2-抓包/DNS工具

    转载请注明出处. TCPDUMP:命令行网络抓包工具tcpdump -h tcpdump version 4.9.2 libpcap version 1.8.1 OpenSSL 1.1.0h 27 M ...

  7. react canvas

    http://engineering.flipboard.com/2015/02/mobile-web/

  8. BZOJ2428_均分数据_KEY

    题目传送门 这道题可以用C++的random_shuffle屮过去. random数列插入顺序,每次都插入数值和最小的那一组. #include <cmath> #include < ...

  9. C++多线程，互斥，同步

    同步和互斥 当有多个线程的时候,经常需要去同步这些线程以访问同一个数据或资源.例如,假设有一个程序,其中一个线程用于把文件读到内存,而另一个线程用于统计文件中的字符数.当然,在把整个文件调入内存之前, ...

  10. 正则表达式简介及在C++11中的简单使用

    正则表达式(regular expression)是计算机科学中的一个概念,又称规则表达式,通常简写为regex.regexp.RE.regexps.regexes.regexen. 正则表达式是一种 ...