[转贴]一个有趣的布局
来源:互联网 发布:台湾关系法 知乎 编辑:程序博客网 时间:2024/05/09 10:22
尝试一下,不用定位,只用浮动,就把这个排版排出来看看。
原文:http://shawphy.com/demo/speciallayout/speciallayout.html
不要被她迷惑了,其实没你想的那么难
<!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>
<title>有趣的布局</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css" title="">
#wrap{width:300px;height:300px;border:1px solid black}
#a{background:gray;}
#b{background:red;}
#c{background:green;}
#d{background:blue;}
#e{background:yellow;}
#a{width:100px;height:200px;float:left;}
#b{width:200px;height:100px;float:left;}
#c{width:100px;height:100px;float:left}
#d{width:100px;height:200px;float:right;}
#e{width:200px;height:100px;float:left;}
</style>
</head>
<body>
<div id="wrap">
<div id="a">a</div>
<div id="b">b</div>
<div id="c">c</div>
<div id="d">d</div>
<div id="e">e</div>
</div>
</body>
</html>
- [转贴]一个有趣的布局
- 有趣的布局
- 一个有趣的游戏
- 一个有趣的故事
- 看到一个有趣的
- 一个有趣的故事
- 一个有趣的现象
- 一个有趣的数学公式
- 一个有趣的javascript
- 一个有趣的程序
- 一个有趣的学习方法
- 一个有趣的框架
- 一个有趣的问题
- 一个有趣的查找
- 一个有趣的广告
- 一个有趣的bug
- 一个有趣的方法
- 一个有趣的故事
- Visio设置(移动一个图形而整体错乱)
- div+css命名规则(转)
- CSS+DIV下的网页设计实例
- sql随机数
- 用层(DIV)来实现弹出窗口
- [转贴]一个有趣的布局
- 通过BLOG传下图片
- 每个程序员都应理解的7种坏味道,11种原则,23种模式
- mysql group by排序问题
- PopUpManager打开窗口并且使其居中
- 广州报到
- Javascript的调试利器:Firebug使用详解(转)
- C#强化系列文章八:HttpModule,HttpHandler,HttpHandlerFactory简单使用收藏
- 文件字节流的复制