<style type="text/css">
body{ margin:0; padding:0;}
.Header{ height:100px; background:red;}
.Left{ float:left; width:200px; height:300px; background:yellow;}
.Right{ float:right; width:200px; height:300px; background:green;}
.Center{ margin:0 200px; height:300px; background:blue;}
.Content{ in-width:700px;_width:expression((document.documentelement.clientwidth||document.body.clientwidth)>700?"700px":"");}
</style>
</head>
<body>
<div class="Header"></div>
<div class="Content">
<div class="Right">右</div>
<div class="Left">左</div>
<div class="Center">中</div>
</div>
</body>

DIV 布局 左中右的更多相关文章

  1. 典型的DIV＋CSS布局——左中右版式

    [效果] [HTML] <%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Def ...

  2. css-前端实现左中右三栏布局的常用方法:绝对定位，圣杯，双飞翼，flex，table-cell,网格布局等

    1.前言 作为一个前端开发人员,工作学习中经常会遇到快速构建网页布局的情况,这篇我整理了一下我知道的一些方法.我也是第一次总结,包括圣杯布局,双飞翼布局,table-cell布局都是第一次听说,可能会 ...

  3. css关于控制div靠左或靠右的排版布局

    关于控制div靠左或靠右的排版布局,我整理三种平时用到的css属性小知识(元素模块靠左或靠右排版): 1.float属性(float 属性定义元素在哪个方向浮动) 值:left(元素向左浮动).rig ...

  4. android RelativeLayout实现左中右布局

    RelativeLayout实现左中右布局   <RelativeLayout android:layout_width="match_parent" android:lay ...

  5. div 布局

    转:http://blog.csdn.net/mercop/article/details/7882000 HTML CSS + DIV实现整体布局 1.技术目标: 开发符合W3C标准的Web页面 理 ...

  6. DIV布局之道二：DIV块的嵌套，DIV盒子模型

    本文讲解DIV块布局的第二种使用方式:嵌套.“DIV嵌套”在有些文献中也被称为“盒子模型”,说的通俗一点就是嵌套(一个大的DIV块内部又包含一个或多个DIV块). 请看如下代码: CSS部分: CSS ...

  7. HTML学习笔记 div布局及table布局案例 第三节 （原创）参考使用表

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

  8. css基础-2 div布局

    div布局 <html> <head> <title>div布局 </title> <meta charset="utf-8" ...

  9. 小div布局之卡片堆叠（card-stacking）

    前端的页面布局和各种效果真是让人眼花缭乱,公司的设计师恨不得在一个网站上把前端的布局和样式效果都用一遍. 如何实现下面这种布局效果?我给这种布局效果起了个名字,叫做小div布局之卡片堆叠.然后我百度了 ...

随机推荐

  1. 查询mysql数据库表的信息（表大小、数据大小、索引大小）

    select * from information_schema.TABLES where information_schema.TABLES.TABLE_SCHEMA='databasename' ...

  2. Apache Conf/Vost/xx.conf 文件配置

    #监听8086端口Listen 8086 NameVirtualHost *:8086#保持绝对一致 <VirtualHost *:> ServerName localhost Serve ...

  3. Java中sychronized方法与sychronized块区别

    一.举几个栗子

  4. Oracle 单实例 迁移到 RAC 实例 -- 使用RMAN 异机恢复

    Oracle 官网有关单实例迁移到RAC的一个步骤说明: How to Convert 10g Single-Instance database to 10g RAC using Manual Con ...

  5. Linux makefile教程之后序十一[转]

    后序 —— 终 于到写结束语的时候了,以上基本上就是GNU make的Makefile的所有细节了.其它的产商的make基本上也就是这样的,无论什么样的make,都是以文件的依赖性为基础的,其基本是都 ...

  6. gcc-4.8.3安装，gdb-7.6安装

    gdb用法: http://blog.chinaunix.net/uid-26548237-id-3435525.html gdb-7.6.tar.gz:  (官网下载:http://ftp.gnu. ...

  7. C# GDI+学习笔记1

    —前言 本文是学习C# GDI+系列的第一篇文章,简单的介绍了GDI+的一些基本绘图内容,比较粗糙.但本文主要是让大家简单的回顾一下GDI+的基本概念.本篇文章的参考代码请在此下载 . GDIPTes ...

  8. ID@Xbox计划宣传片 XboxOne喜迎大波小游戏（转）

    微软Xbox One游戏不够多?别担心,微软的ID@Xbox计划将带来一大波独立游戏!微软在今天正式公布了即将登陆旗下的Xbox One主机平台的独立游戏阵容,数量多达32款,官方的宣传片也已放出,感 ...

  9. 反汇编一个简单的C程序

    一.实验截图 二.汇编代码分析: cpu首先执行main函数里的pushl %ebp和movl %esp %ebp.如下图: esp减去4就是向上移动4位到1,如下图: 把1赋值给esp,如下图: c ...

  10. （转载）OC学习篇之---类的延展

    前一篇文章我们介绍了类的类目概念和使用,那么这篇文章我们继续来介绍一下OC中的一个特性:延展. 其实说白了,延展就是弥补C语言中的前向申明,我们知道,在C语言中,如果你想调用一个函数的话,那么在此之前 ...