.main,.sitebar{
      height: 300px;
      font: bolder 20px/300px "微软雅黑";
      color: black;
      text-align: center;
}
.main{
      width: 100%;
      float: left;
}
.main .content{
      margin-left: 200px;
      background: red;
}
.sitebar{
      width: 200px;
      float: left;
      margin-left: -100%;
      background: green;
}
<div class="main">
      <div class="content">hhhhhhhhhhhhh</div>
</div>
<div class="sitebar">
      hehhehhe
</div>

两栏自适应布局,右侧div宽高不定的更多相关文章

  1. css实现等高布局 两栏自适应布局 三栏自适应布局

    等高布局: HTML结构如下: <div class="wrapper"> <div class="box"> <h1>.. ...

  2. css布局 - 两栏自适应布局的几种实现方法汇总

    这种两列布局的样式是我们在平时工作中非常常见的设计,同时也是面试中要求实现的高频题.很有必要掌握以备不时之需: 整理了几种实现方法,当然,风骚的代码不止这几种能实现,欢迎各位的补充. 方法汇总目录 简 ...

  3. 利用float与overflow:hidden实现移动端两栏自适应布局

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. 【转】CSS深入理解流体特性和BFC特性下多栏自适应布局

    这篇文章发布于 2015年02月12日,星期四,23:36,归类于 css相关. 阅读 30873 次, 今日 63 次 by zhangxinxu from http://www.zhangxinx ...

  5. css多栏自适应布局

    css多栏自适应布局还是需要总结一下的,都是基本功. 一般使用position属性布局,或者用float属性布局,也可以使用display属性. 看资料说position适合首页布局,因为首页内容往往 ...

  6. CSS深入理解流体特性和BFC特性下多栏自适应布局

    一.块状元素的流体特性与自适应布局 块状元素像放在容器中的水流一样,内容区域会随着margin, padding, border的出现自动填满剩余空间,这就是块状元素的流体特性. 来一个小实验: di ...

  7. 使用CSS实现三栏自适应布局(两边宽度固定,中间自适应)

    来源:http://blog.csdn.net/cinderella_hou/article/details/52156333 所谓三列自适应布局指的是两边定宽,中间block宽度自适应.这道题在今年 ...

  8. css 多栏自适应布局

    在页面重构中,我们经常会需要实现多栏布局,例如n栏固定宽度 + m栏自适应宽度的组合,绝对布局+padding+百分比宽度是容易想到的比较暴力的解决方法,但是作为未来的"工程师", ...

  9. 你知道BFC、IFC、FFC、GFC及多栏自适应布局吗?

    FC(Formatting Context)格式化内容,常见的FC有BFC.IFC.FFC.GFC四种类型,BFC和IFC是W3C CSS2.1规范提出的概念,FFC和GFC是W3C CSS3规范提出 ...

随机推荐

  1. Java之引用类型分析(SoftReference/WeakReference/PhantomReference)

    引言: 即使对于Java的很多老鸟来说,如果忽然问他引用的类型,大概率是一脸茫然,不知所措的-.Java中的引用还分类型,神马情况??? 本文将针对这些类型进行分析,帮助您一文知所有类型. Java的 ...

  2. HDU 1033

    http://acm.hdu.edu.cn/showproblem.php?pid=1033 这题的题干说的很绕,结合样例不难理解题意,走折线,A代表顺时针,V代表逆时针,给一个包含A和V的字符串,输 ...

  3. [pandas] SettingWithCopyWarning: A value is trying to be set on a copy of a slice from a DataFrame

    转载自https://blog.csdn.net/blackyuanc/article/details/77892784 问题场景:       在读取CSV文件后,在新增一个特征列并根据已有特征修改 ...

  4. linux下环境变量PATH设置错误的补救

    本文转自: http://blog.clzg.cn/blog-614449-740527.html    之前不小心在/etc/profile中添加了错误的PATH变量,导致几乎所有的系统命令无法使用 ...

  5. C++ 回调函数的几种策略

    Stackoverflow中提出了这样一个问题:假设我们实现了一个User类,Library类,现在Library类中utility需要回调User中func方法,总结答案,常见的几种方法如下: 静态 ...

  6. Android:数据持久化(1/2)文件、SharedPreferences

    Summary 持久化的3种方法: 普通文件:I/O流操作文件: SharedPreferences:XML文件,通过key-value pair的形式存储数据: SQLite:Android自带数据 ...

  7. Maven系列(一)之初识Maven

    Maven是个啥? Maven主要服务于基于Java平台的项目构建.依赖管理和项目信息管理,并且Maven是跨平台的,这意味着无论是在Windows上,还是在Linux或者Mac上,都可以使用同样的命 ...

  8. python(十)、进程

    一.基本概念 进程和线程是编程中非常重要的概念,它是并发和异步的基础性知识. 1.进程 概念:程序在并发环境中的执行过程.进程作为系统资源分配.调度.管理和独立运行的基本单位,决定了操作系统的四大特性 ...

  9. Redis 列表 List 主要操作函数

    /** * redis 列表 List Redis列表是简单的字符串列表,按照插入顺序排序.你可以添加一个元素导列表的头部(左边)或者尾部(右边) */ //lpush 新增一个列,多个列可以用空格隔 ...

  10. javascript异常处理。 屏蔽异常

    http://www.cnblogs.com/aqbyygyyga/archive/2011/10/29/2228824.html