HTML5的Details标签
浏览器：chrome 12以上
刚被添加到chrome中的元素，让人喜欢。
点击标签时显示和隐藏内容。之前这种效果是用javascript 实现的，FAQ页面中经常使用这个功能。
创建一个标签
<details>
<summary>Who goes to college?</summary>
<p>Your mom.</p>
</details>
当我们需要显示和隐藏内容时，用details元素包括 一个summary 标签， 接着是内容， 点击summary标签时，内容标签切换显示
来些样式
body { font-family: sans-serif; }
details {
overflow: hidden;
background: #e3e3e3;
margin-bottom: 10px;
display: block;
}
details summary {
cursor: pointer;
padding: 10px;
}
details div {
float: left;
width: 65%;
}
details div h3 { margin-top: 0; }
details img {
float: left;
width: 200px;
padding: 0 30px 10px 10px;
}
总结：details + summary 标签为网页提供了方便的显示，隐藏功能。
css 中的浮动，很好。。。。。
百分比来表示宽度 pointer的设置 主元素用margin-bottom区分下面的
内部元素用padding 来做间隔