评论栏实战
时如逝水，永不回头。一晃，物是人非事事休。
今天重新看视屏从一个案例开始，讲的是简单的评论栏，因该说做的是一个简单的任务栏，，中间有讲，这样去避免使用margin，应为margin会带来很多的bug。在已有一行文字下面接着块级元素的时候呢，可以用切片量一下，从文字的顶部到块级元素顶部讲的距离，用这个距离当做文字的高，根据元素的特性，会自动的把会计元素定下去，哼完美。
<html lang="zh-CN">
<head>
<meta charset="utf-8" />
<title>评论栏</title>
<style rel="stylesheet" type="text/css">
*{
padding:0;
margin:0;
}
.message{
width:960px;
margin:10px auto;
border:1px solid #ccc;
padding:20px;
}
.message h4{
height:55px;
}
.message a{
text-decoration:none;
color:#f00;
}
.message textarea{
width:800px;
height:300px;
border:1px solid #0cc;
color:#eee;
padding:20px;
margin-bottom:35px;
border-radius:5px;
}
p{
height:40px;
line-height:40px;
font-size:20px;
font-family:"黑体";
float:right;
}
</style>
</head>
<body>
<div class="message">
<h4>评论<img src="image/top.png"/><a href="#">点我提交</a></h4>
<textarea>请输入您的宝贵意见</textarea><br />
<input type="image" src="image/top.png" />
<p>更多</p>
</div>
</body>
</html>
中间没有太多的细节处理，所以页面不完美，其中有一个属性名忘记了拼写的方式，就是圆角属性名：radius，这个标签全部是：border-radius。
浮动并不是一个很好的属性，因为他会影响其他元素，所以我们需要清除浮动。为什么要浮动？为什么要清除浮动？为什么要用定位？
为什么要浮动？
因为我们需要把块级元素同一行显示，这时候就要用浮动，但是问题来了，当你使用float的时候，可能会造成父元素坍缩，大多时候我们不希望父级坍缩有时候父级的高度不方便设置高度，这时候就需要清除浮动。