<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title> </title>
<style type="text/css">
#head{
height:40px;
background-color:#0033CC;
margin:0;
}
#content{
background:#CCCCCC;
height:200px;
margin:0;
}
#left{
width:20%;
height:200px;
background:#CCCC66;
float:left;
margin:0;
}
#c{
width:60%;
height:200px;
background:red;
margin:0;
float:left;
}
#right{
width:20%;
height:200px;
background:#339966;
float:right;
margin:0;
}
#foot{
background:#0099CC;
height:40px;
margin:0;
}
</style>
</head>
<body>
<div id="head">head</div>
<div id="content">
<div id="left">left</div>
<div id="c">content</div>
<div id="right">rigth</div>
</div>
<div id="foot">foot</div>
</body>
</html>

  

上下左右布局(DIV+CSS)的更多相关文章

  1. div+css布局教程系列1

    <!doctype html><html><head><meta charset="utf-8"><title>简单布局 ...

  2. 深度理解div+css布局嵌套盒子

    1. 网页布局概述 网页布局的概念是把即将出现在网页中的所有元素进行定位,而CSS网页排版技术有别于传统的网页排版方法,它将页面首先在整体上使用<div>标记进行分块,然后对每个快进行CS ...

  3. 前端之DIV+CSS布局

    刚开始学习javaweb,首先定位学习后端,可是随着学习的深入和项目的进行,越来越发现前端知识的欠缺,之前也随着视频看过,随着时间的流逝,具体的应用也随之忘记了. 而现在开始自己练习项目,发现前端知识 ...

  4. DIV+CSS布局中主要CSS属性介绍

    Float: Float属性是DIV+CSS布局中最基本也是最常用的属性,用于实现多列功能,我们知道<div>标签默认一行只能显示一个,而使用Float属性可以实现一行显示多个div的功能 ...

  5. DIV+CSS布局网站基本框架

    html代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www. ...

  6. 【转】css布局居中和CSS内容居中区别和对应DIV CSS代码

    原文地址:http://www.divcss5.com/jiqiao/j771.shtml css布局居中和CSS内容居中区别和对应DIV CSS代码教程与图文代码案例篇 对于新手来说DIV CSS布 ...

  7. 【转】一个DIV+CSS代码布局的简单导航条

    原文地址:http://www.divcss5.com/shili/s731.shtml 简单的DIV CSS代码布局实现导航条 一个蓝色主题的导航条布局案例,本CSS小实例,采用DIV CSS实现. ...

  8. DIV+CSS常用网页布局技巧!

    以下是我整理的DIV+CSS常用网页布局技巧,仅供学习与参考! 第一种布局:左边固定宽度,右边自适应宽度 HTML Markup <div id="left">Left ...

  9. 使用Div+CSS布局设计网站的优点

    网页设计业界越来越关注DIV+CSS的标准化设计,大到各大门户网站,小到不计其数的个人网站,在Div+CSS标准化的影响下,网页设计人员已经把这一要求作为行业标准.那么什么是Div+CSS标准?Div ...

  10. DIV+CSS列表式布局(同意图片的应用)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. 关于JS APP

    多屏screen, JS如何路由,如何换页,导航.通过JS来实现. 当前页面的逻辑通过JS来实现.HTML DOM, Event, Widget. 核心在于function. JS 不仅仅是DOM, ...

  2. Unity Texture 2D Compress

    测试了一下 unity 图片 对 apk 的影响. 上两种测试环境    1024 * 1024     带 alpha的话 默认压缩就是RBA 16bit就是2M     不带的话就是 etc 的话 ...

  3. ssh-copy-id(双机互信)

    最简单的2步骤: ssh-keygen -t rsa 需要输入的地方就回车 ssh-copy-id root@192.168.0.10 详细:ssh-keygen 创建公钥和密钥. ssh-copy- ...

  4. Ruby Profiler 详解之 stackprof

    简介 stackprof 是基于采样的一个调优工具,采样有什么好处呢?好处就是你可以线上使用,按照内置的算法抓取一部分数据,只影响一小部分性能.它会产生一系列的 dump 文件,然后你在线下分析这些文 ...

  5. ASP.NET和JSP相似方法总结(持续中。。)

    一.HTTP请求处理 1.获取GET请求数据 ASP.NET:Request.QueryString[name] JSP:request.getParameter(String name); 2.解决 ...

  6. 在Delphi中实现动画窗口

    Windows下有一个函数AnimateWindow,在Delphi自带的Win32 API Help中是找不到的.你可以在Delphi的编辑器中输入windows.等待代码向导出来,继续输入Anim ...

  7. IDEA开发spark本地运行

    1.建立spakTesk项目,建立scala对象Test 2.Tesk对象的代码如下 package sparkTest /** * Created by jiahong on 15-8-2. */ ...

  8. Fiddler手机抓包工具如何设置过滤域名?

    fiddler手机抓包工具如何设置过滤域名?如题.fiddler抓包可以完成我们移动开发者的调试测试需求.所以说抓包尤其重要,但是多余的网页请求和手机的其他链接影响我们手机开发的需求.下面我教大家怎么 ...

  9. Lines演示程序

    #include "stdafx.h"#include "d3d9.h"#include "d3dx9.h" #pragma comment ...

  10. 跨平台的加密算法XXTEA 的封装

    跨平台的加密算法XXTEA 的封装 XXTEA算法的结构非常简单,只需要执行加法.异或和寄存的硬件即可,且软件实现的代码非常短小,具有可移植性. 维基百科地址:http://en.wikipedia. ...