<div id="fixed">Sidebar</div>
<div id="fluid">Content</div>
#fixed, #fluid{
padding:20px;
margin-left:2px;
margin-right:2px;
}
#fixed {
float:left;
width:150px;
background-color:#ccc;
}
#fluid {
overflow:hidden;/*没有此属性的话margin会失效*/
background-color:#999999;
}

http://jsfiddle.net/hhcncku5/

fixed fluid layout的更多相关文章

  1. 响应式布局(Responsive Layout)/流式布局(Fluid Layout)/自适应布局(Adaptive)

    1.使用媒体查询来适应不同视口的固定宽度设计,例如bootstrap的container类. 2.将固定像素布局转换成灵活的百分比布局,才能让页面元素根据视口大小在一个又一个媒体查询间伸缩修正样式. ...

  2. HTML5移动Web开发(四)——移动设计

    桌面网站的设计趋势是固定布局(fixed layout)或流体布局(fluid layout),而在移动网站中我们应该始终使用流体布局,它可以使你的网站适应不同的设备尺寸. 固定宽度布局(Fixed ...

  3. <转>HTML+CSS总结/深入理解CSS盒子模型

    原文地址:http://www.chinaz.com/design/2010/1229/151993.shtml 前言:前阵子在做一个项目时,在页面布局方面遇到了一点小问题,于是上stackoverf ...

  4. html5移动web开发实战必读书记

    原文  http://itindex.net/detail/50689-html5-移动-web 主题 HTML5 一.配置移动开发环境 1.各种仿真器.模拟器的下载安装 http://www.mob ...

  5. 聊聊css盒子模型

    css盒子模型原理: 在网页设计中常听的属性名:内容(content).填充/内边距(padding).边框(border).外边距(margin), CSS盒子模式都具备这些属性. 这些属性我们可以 ...

  6. bootstrap scaffold框架

    这是一段典型的html typical HTML file: <!DOCTYPE html> <html> <head> <title>Bootstra ...

  7. Bootstrap 布局

    bootstrap提供的布局主要有两种,固定布局和流动布局. Bootstrap 固定布局 用法 <body> <div class="container"> ...

  8. CSS 布局:40个教程、技巧、例子和最佳实践

    前言: 布局是WEB开发一个重要的课题,进入XHTML/CSS后,使用TABLE布局的方式逐渐淡出,CSS布局以众多优点成为主流,本文将介绍40个基于CSS的web布局的资源和教程.文章的出处在htt ...

  9. 22、(转载)jQueryMobile 知识点总结

    本文转自:http://www.cnblogs.com/jxyedu HTML5技术生态介绍 H5的现状与未来 HTML5是用于取代1999年所制定的 HTML 4.01 和 XHTML 1.0 标准 ...

随机推荐

  1. git clone过程中发生的错误

    错误提示: 问题原因以及解决方式:http://blog.csdn.net/huihut/article/details/79404421

  2. CSS 小结笔记之定位

    定位也是Css中一个非常强大的属性.定位主要是用来移动盒子,将其移动到我们想要的位置. 定位分为两部分 1.边偏移 left | right |top |bottom:偏移大小:(边偏移一般制定上就不 ...

  3. HBase Region分裂实现

    分裂策略 不同的分裂策略的实现需要继承RegionSplitPolicy,主要实现两个方法: shouldSplit()表示是否需要分裂 getSplitPoint()得到分裂点rowkey 从 HB ...

  4. SQL Server配置数据库邮件

    需求描述 在生产环境中,大部分情况下需要有自己的运维体制,包括自己健康状态的检测等.如果发生异常,需要提前预警的,可以以发邮件告知,邮件作为一种非常便利的预警实现方式,在及时性和易用性方面也有着不可替 ...

  5. Windows与Linux 互相访问,挂载过程

    开始使用Linux时浏览器无法访问,多次尝试以失败告终,果断放弃自我动手, 找了大神帮助,弄了半天终于可以访问.但是之前在Windows下的文件也不能放弃,从大神那里那里文档,然后进行尝试 1.在Wi ...

  6. Linux 系统必须掌握的文件_【all】

    0.Linux 系统文件的详解 1.Linux 系统的网络配置文件 2.Linux 系统的DNS配置文件 3.Linux 系统的IP与域名解析文件[局域网的DNS] 4.Linux 系统的主机别名文件 ...

  7. 字符串到-->list到-->字典的转变

    怎么把字符串变成字典呢?? 要先转成列表list(用split方法),然后再把列表转成字典,这时候就用到-->怎么把列表转换成字典呢??列表的索引和字典的新增,然后就能把字符串转成字典了.

  8. Django 错误之 No module named ‘MySQLdb’

    由于卸载Mysql时将很多相关依赖包都卸载了,重装mysql后启动django出现如下错误: django.core.exceptions.ImproperlyConfigured:Error loa ...

  9. 关于Calculator的第四次作业

    一.魔法传送门: 问题描述:点我点我点我! 仓库地址:点我点我点我! 二.网上资料: sstream的介绍及应用 后缀表达式C++代码 中缀转前缀及后缀方法 C++计算器源代码 三.实现过程: 在看到 ...

  10. [装]JMX监控Hadoop

    http://chenjc-it.iteye.com/blog/1539746 实验成功!