CSS 布局实现

原创 2016年05月31日 15:45:35
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style type="text/css">
* {
	padding: 0;
	margin: 0;
}
body{
	background-color:#F0E9D8;
}
#wrap {
	margin: 0px auto;
	width: 80%;
	background-color:#FFF;
}
#left {
	float:left;
	width:20%;
	height:500px;
	border:2px solid #0F0;
	margin-top:10px;
	margin-left:10px;
}
#right{
	float:right;
	width:35%;
	height:600px;
	border:2px solid #00F;
	margin-top:10px;
	margin-right:10px;
}
#center{
	float:left;
	width:40%;
	height:800px;
	margin-top:10px;
	margin-bottom:50px;
	margin-right:5px;
	margin-left:5px;
	border:2px solid #300;
}
#bottom{
	clear:both;
	margin:0px auto;
	width:90%;
	height:30px;
	border:2px solid #099;
}
#ad{
	position:fixed;
	border:#999 solid 2px;
	width:120px;
	height:200px;
	right:0px;
	top:160px;
	background-image:url(200912317295935977803.jpg);
}
</style>
</head>

<body>
<div id="wrap">
  <div id="left"> </div>
  <div id="center"> </div>
  <div id="right"> </div>
  <div id="bottom"> </div>
</div>
<div id="ad"></div>
</body>
</html>

版权声明:本文为博主原创文章,未经博主允许不得转载。

相关文章推荐

DIV+CSS实现3列布局

  • 2010-03-12 14:24
  • 19KB
  • 下载

两种方式实现CSS双飞翼布局

双飞翼布局,就是两端固定宽高,中间自适应的三栏布局 先来张图,左边和右边的灰色块是固定宽高的,中间绿色的区域是宽高自适应方式一:通过flex弹性布局来实现看代码//HTML结构,div2是中间的自适应...

CSS+DIV:实现炫酷网页样式与布局

虽然之前也接触过HTML和CSS,也做过一段时间的项目,使用过CSS和DIV,但是终究没有体会到这两者融会贯通后,所能达到的效果,远远超乎我的想象。         其实很多写过前端页面的人都知道DI...

div+css实现frameset网页布局

  • 2016-03-02 11:20
  • 1.35MB
  • 下载

HTML CSS + DIV实现整体布局

HTML CSS + DIV实现整体布局 1、技术目标: 开发符合W3C标准的Web页面理解盒子模型实现DIV+CSS整体布局 2、什么是W3C标准?     W3C:Worl...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)