css和html做一个网页,HTML与CSS代码写出一个简单的页面框架？

html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-

transitional.dtd">

基本框架结构

* { margin:0; padding:0; }

body { margin:0 auto; font-size:12px; font-family:Verdana; line-height:150%; }

ul { list-style:none; }

img { border:0 none; }

a { text-decoration:none; color:#333; }

h1 { font-size:18px; }

h2 { font-size:14px; }

h3 { font-size:14px; font-weight:normal; }

h4 { font-size:12px; }

h5 { font-size:12px; font-weight:normal; }

.clearfloat { clear:both; height:0; font-size: 1px; line-height: 0; }

#container{ margin:0 auto; width:960px; }

/*header*/

#header { height:100px; background:#cf0; }

#header h1 { padding:10px 20px; }

#nav { background:#FF6600; height:35px; margin-bottom:6px; padding:5px; }

#nav ul li { float:left; }

#nav ul li a { display:block; padding:4px 10px 2px 10px; color:#fff; text-decoration:none; }

#nav ul li a:hover { text-decoration:underline; background:#06F; color:#FFF; }

/*main*/

#mainContent { overflow:auto; zoom:1; margin-bottom:6px; }

#side { width:200px; float:left; }

.sidebox { border:1px solid #ed6400; margin-bottom:6px; }

.sidebox h4 { background:#ff911a; padding:2px 6px; border-bottom:1px solid #ed6400; color:#fff; }

.sidebox ul { padding:4px 6px; }

#main { width:742px; float:right; }

.mainbox { border:1px solid #ed6400; margin-bottom:6px; }

.mainbox h2 { background:#ff911a; padding:2px 6px; border-bottom:1px solid #ed6400; color:#fff; }

.mainbox ul { padding:4px 6px; }

/*footer*/

#footer { border-top:3px solid #0CF; height:50px; text-align:center; padding:6px; color:#999; }

头部

• 导航一
• 导航二
• 导航三
• 导航四
• 导航五

块标题

块内容

块标题

块内容

底部

自己把样式放进css文件里面