<html>
<head>
<style type="text/css">
*{ margin: 0;padding: 0;}
#wrapper {
width: 700px;
margin: 20px auto;
}
ul {
list-style :inside;
}
#header{
width: 100%; height: 100px;
line-height:100px;
text-align: center;
color: orange;
background:#80ffff;
}
#content{
float: right;
overflow: hidden;
}
#sidebar {
width: 150px;
height:180px;
float: left;
background: green;
}
#main-content {float: left;
margin: 0px 0px 50 px 160 px;
}
#footer{
wdith: 100%; height: 50px;
background: #80ffff;
}
</style>
<title>hjhj </title>
</head>
<body>
<div id="wrapper">
<div id="header">
<h1> this is header </h1>
</div><!--end #header-->
<div id="sidebar">
<ul>
<li><a href="#">HomePage</a></li>
<li> <a href="#">Forum</a></li>
<li><a href="#"> Contact</a></li>
<li><a href="#">gallery</a></li>
</ul>
</div><!--end #maiNav-->
<div id="mai-content">
<h1>this is header </h1>
<p>
CSS Selectors là một khái
niệm hết sức quan trọng trong CSS.
Những property của CSS nếu bạn có
quên hoặc không biết thì có thể google là ra.
</p>
<p>
Nhưng nếu bạn không nắm rõ khái niệm về CSS Selectors thì giống như bạn
đi đường mà không biết đường vậy.
Nếu không biết đường rất có thể bạn quẹo nhầm đường,
đi sai địa chỉ hoặc thậm chí còn không tới đích.
Còn nếu không rõ về khái niệm CSS Selectors thì bạn sẽ không hướng tới đối tượng mà mình muốn được,
code CSS không như ý muốn, lạm dụng Class và ID, code CSS khó hiểu và phức tạp …
</p>
</div><!--end #main-content-->
<div id="footer">
<p >© 2009 - 2010 CanIuG </p>
</div><!--end #footer-->
</div><!--end #warpper -->
</body>
</html>
hjhj đây chj là bài đơn giản .Sử dụng các thẻ cơ bản của HTML và tạo giao điện = CSS 2 hjhj có j mong các bạn pm góp ý cho minh nha 
