您的位置:首页 > Web前端 > CSS

Html-DW(2)div & css 简单的三栏页面

2014-09-21 07:33 465 查看
Html代码:

<head>

<meta charset="UTF-8">

<title>MyBlog</title>

<link href="css/main.css" type="text/css" rel="stylesheet">

</head>

<body>

<div id="contain">

    <div id="header"></div>

       <div id="body"></div>

       <div id="foot"></div>

    </div>

</body>

main.css代码:

*{background-color:#09C}

*{margin:0px} /*去掉缝隙*/

/*星号,*代表整个页面的设置*/

#contain{background-color:#968;width:960px;height:400px;

margin-left:auto;margin-right:auto}
/*margin-left/right:对象居中*/

#header{background-color:#3CF;width:960px;height:100px;}

#body{background-color:#30C;width:960px;height:200px;}

#foot{background-color:#FC3;width:960px;height:100px;}

效果:



实际上现在的网页多数都是大div套小div的

http://edu.51cto.com    来自51cto的教学
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: