<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/htmlcharset=gb2312" />
<title>无标题文档</title>
<style>
.list{
float:left
width:350px}
ul{
list-style-type:none
float:left
margin-bottom:10px}
.hot{
float:right
width:200px
}
</style>
</head>
<body>
<div class="list">
<ul><h4>栏目一</h4><li>内容一</li><li>内容一</li><li>内容一</li><li>内容一</li></ul>
<ul><h4>栏目二</h4><li>内容二</li><li>内容二</li><li>内容二</li><li>内容二</li></ul>
<ul><h4>栏目三</h4><li>内容三</li><li>内容三</li><li>内容三</li><li>内容三</li></ul>
<ul><h4>栏目三</h4><li>内容三</li><li>内容三</li><li>内容三</li><li>内容三</li></ul>
</div>
<div class="hot">
<ul><h4>最新推荐</h4><li>最新内容</li><li>最新内容</li><li>最新内容</li><li>最新内容</li></ul>
</div>
</body>
</html>
保存后ie ff运行，有不懂可以问我，宽度可以自己调节。
这个可以用javascrip 实现，如果在不考虑ie的情况下也可以通过css的伪类来实现。现在呢，你也可以不需要知道什么鬼javascript。有木有DW?打开它，点击插入选择spry然后选择spry选项卡式面板，ok你就看见了一个差不多的东西了，完全不需要考虑javascript代码。尽情修改css样式和html吧，直到你想要的样子。你随便改改，一会你也就知道，哪些地方能改，那些不能碰。
