演示：http://www.pcguides.cn/web/perl/25467.shtml 点查看全部评论
DIV+CSS布局，兼容IE7、IE6、firefox
评论模板：
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>评论：[!--title--]</title>
<meta name="keywords" content="[!--title--]评论" />
<meta name="description" content="[!--title--]评论" />
<meta name="copyright" content="(C)2007 龙腾盛世 www.Dragonad.cn" />
<meta name="author" content="Blank" />
<link href="/img/comment.css" rel="stylesheet" type="text/css" />
</head>
<body><div id="main"><div id="header"><a href="/"><img src="/img/logo.gif" border="0" /></a><h1>网友评论</h1><span class="url"><a href="#do">我也评两句</a></span></div><h2><span class="title">评论：<a href="[!--titleurl--]" target="_blank">[!--title--]</a></span><span class="back"><a href="[!--titleurl--]" target="_blank">查看原文</a></span></h2><div id="box"><div id="page"><span class="i1">网友评论</span><span class="page1">[!--listpage--]</span></div>[!--empirenews.listtemp--]<div id="list"><div class="info"><span class="name">本站网友 [!--username--] <font color="#666666">ip:[!--plip--]</font></span><span class="time">[!--pltime--] 发表</span></div><div class="text">[!--pltext--]</div><div class="re"><a href="#saypl"[!--includelink--]>回复本贴</a> <a href="mailto:blank@yon.com.cn">举报</a></div></div>[!--empirenews.listtemp--]<div id="page2">[!--listpage--]<br /><span class="no">网友评论仅供网友表达个人看法，并不表明本站同意其观点或证实其描述</span></div><a name="do" id="do"></a><div id="comment"><script>
function CheckPl(obj)
{
if(obj.saytext.value=="")
{
alert("错误，评论不能为空");
obj.saytext.focus();
return false;
}
return true;
}
</script><form action="../enews/index.php" method="post" name="saypl" id="saypl" onsubmit="return CheckPl(document.saypl)"><span class="you">我也评两句</span><span class="reinfo">用户名：<input name="username" type="text" id="username" size="12" value="[!--lusername--]" />密码：<input name="password" type="password" id="password" size="12" value="[!--lpassword--]" />验证码：<input name="key" type="text" id="username3" size="6" /><img src="[!--key.url--]" /> <a href="#">还没有注册？</a></span><span class="retext"><textarea name="saytext" cols="58" rows="6" id="saytext"></textarea><span class="bt"><input name="nomember" type="checkbox" id="nomember" value="1" checked="checked" />匿名发表<br /><input name="imageField" type="submit" id="imageField" value=" 提 交 " /></span></span><input name="id" type="hidden" id="id" value="[!--id--]" /><input name="classid" type="hidden" id="classid" value="[!--classid--]" /><input name="enews" type="hidden" id="enews" value="AddPl" /><input name="repid" type="hidden" id="repid" value="0" /></form></div></div><div id="cr">关于我们 - 免责声明 - 帮助(？) - 广告服务 - 联系我们 - 用户注册 - 企业服务<br />龙腾盛世 <a href="http://www.dragonad.cn" target="_blank">www.Dragonad.cn</a><br />©2007</div></div><script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "UA-2297709-2";
urchinTracker();
</script></body>
</html>
comment.css：
/* CSS Document disinged by Blank */
* { margin: 0; padding: 0; }
body { color: #222; font-size: 12px; }
a { color: #222; text-decoration: none; }
a:hover { color: #f00; text-decoration: underline; }
#main { width: 752px; margin-right: auto; margin-left: auto; }
#header { width: 752px; float: left; margin-bottom: 10px; padding-bottom: 4px; border-bottom: 3px solid #222; }
#header img { float: left; }
h1 { font-size:32px; font-weight: bold; float: left; padding:12px 0 0 10px; }
.url { float: right; padding-top: 30px; padding-right: 2px; padding-left: 10px; }
.url a { color: #e01919; font-weight: bold; }
h2 { color: #1e3a9e; font-size: 25px; font-weight: bold; width: 752px; float: left; }
.title { float: left; }
.title a { color: #1e3a9e; }
.back { font-size: 12px; font-weight: normal; float: right; padding-top: 8px; padding-right: 2px; }
#box { background-color: #fff; width: 750px; float: left; margin-top: 10px; border: solid 1px #ccc; }
#page { background-color: #fff; width: 750px; float: left; border-bottom: 1px solid #ccc; }
.i1 { background-image: url(comment_i.gif); background-repeat: no-repeat; background-position: 8px center; text-indent: 25px; float: left; padding-top: 8px; padding-bottom: 5px; }
.page1 { float: right; padding-top: 8px; padding-right: 12px; }
#list { background-color: #f8fcff; background-image: url(comment_bg.gif); background-repeat: repeat-x; background-position: 0 bottom; width: 722px; float: left; margin-right: 2px; margin-left: 2px; padding-right: 12px; padding-bottom: 10px; padding-left: 12px; }
*html #list { background-color: #f8fcff; background-image: url(comment_bg.gif); background-repeat: repeat-x; background-position: 0 bottom; margin-right: 1px; margin-left: 1px; padding-right: 12px; padding-bottom: 10px; padding-left: 12px; width: 726px; float: left; }
.info { width: 722px; float: left; padding-top: 12px; padding-bottom: 12px; }
.info span.name { color: #1f3a87; float: left; }
.info span.time { color: #666; float: right; }
.text { font-size: 14px; width: 606px; float: left; padding-right: 50px; padding-bottom: 10px; padding-left: 5px; }
.re { text-align: right; width: 722px; float: left; }
.re a { color: #1f3a87; }
#page2 { line-height: 20px; background-color: #f8fcff; text-align: right; width: 734px; float: left; margin-right: 2px; margin-left: 2px; padding-top: 10px; padding-right: 12px; padding-bottom: 8px; border-bottom: 1px solid #ccc; }
*html #page2 { line-height: 20px; background-color: #f8fcff; text-align: right; margin-right: 1px; margin-left: 1px; padding-top: 10px; padding-right: 12px; padding-bottom: 8px; width: 738px; float: left; border-bottom: 1px solid #ccc; }
.no { color: #e01919; font-size: 12px; }
#comment { background-color: #f8fcff; width: 746px; float: left; margin-right: 2px; margin-left: 2px; }
*html #comment { background-color: #f8fcff; margin-right: 1px; margin-left: 1px; width: 750px; float: left; }
.you { color: #1f3a87; font-size: 14px; float: left; padding: 12px 10px 10px; }
.reinfo { float: left; padding-top: 8px; }
.reinfo img { vertical-align: middle; padding-bottom: 5px; }
.reinfo input { margin-right: 8px; }
.retext { background-color: #f3f3f3; width: 100%; float: left; padding-top: 22px; padding-bottom: 22px; border-top: 1px solid #ccc; }
.retext textarea { background-image: url(logo2.gif); background-repeat: no-repeat; background-position: center; width: 535px; height: 130px; float: left; margin-left: 60px; border-top-style: inset; border-top-width: 2px; border-left-style: inset; border-left-width: 2px; }
.bt { line-height: 40px; text-align: center; float: left; margin-left: 35px; padding-top: 50px; }
#cr { font-family: tahoma; line-height: 20px; text-align: center; width: 752px; float: left; padding-top: 10px; padding-bottom: 15px; }
上传以下图片：
|
顶部 
加入收藏夹
2007-09-09 00:12:18 
已设置保密
回复
引用
报告
编辑
删除
评论模板以修正~~~
