CSS中最基本的外框架_电脑软硬件应用网_国内最受关注的计算机应用解决中心

首页·电脑学院·电脑故障·操作系统·硬件教程·局域网技术·QQ技巧·网络安全·办公软件· 数据库

导航·设计学院·图像处理·网页设计·软件教程·服务器技术·笔记本·专家装机·网络编程·在线问答

当前位置：电脑软硬件应用网 > 设计学院 > 网络编程 > CSS教程 > 正文

CSS中最基本的外框架

CSS中最基本的外框架

2009-3-18 23:05:47　　文/网络整理　　出处:电脑软硬件应用网　　

<!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>css基本布局方法</title>
<style type="text/css">
*
{
font-size:12px;
font-family:verdana;
margin:0px;/*--定义元素周围的空间*/
padding:0px;/*--定义元素边框与元素内容之间的空白*/
}
#body
{
position:relative;
width:85%;
margin:3px auto;/*上下,左右,这里的左右就是居中*/
height:100%;
}
#sidebar /*左边*/
{
position:absolute;
left:0;
top:0;
width:200px;
}
#right
{
width:240px;
position:absolute;
right:0;
top:0;
}
#center
{
margin:0 241px 0 201px;/*上右下左*/
}
#header,#footer
{
width:85%;
margin:0 auto;/*由浏览器设置*/
height:50px;
}
#sidebar,#right,#center,#header,#footer{border:solid 1px #000;}
#sidebar,#right,#center{height:780px;}
</style>
</head>
<body>
<div id="header">head</div>
<div id="body">
<div id="sidebar">left<br />left<br /></div>
<div id="center">center</div>
<div id="right">right</div>
</div>
<div id="footer">footer</div>
</body>
</html>

上一篇文章： CSS写的各种好看的层颜色

下一篇文章： CSS制作网页时遇到BUG的解决方法

最新热点		最新推荐		相关文章
				CSS伪类选择器nth-child() css3教程:background属性调整增强 css教程：CSS3 Media Queries 详解 CSS 类名的长命名和短命名 CSS实例教程:非浮动区域设置宽度如何使用css约束一个层不可见？ CSS的list-style解释小议使用“完整”的CSS的缺点 CSS中的相对定位与绝对定位详解实例使用DIV+CSS制作圆角边框加阴影…