<h4>标题</h4>
<ul>
    <li>列表项</li>
    <li>列表项</li>
    <li>列表项</li>
    <li>列表项</li>
    ...
    <li>列表项</li>
</ul>

CSS代码：就是大家看到的视觉效果。通过更换css文件，我们可以在不修练html代码的基础上任意变换这个页面的视觉效果。所有的效果应该是与html内容本身没有关系的。因为视觉效果仅仅是为了让页面更漂亮、更容易让用户去接受。

Javascript:细心的朋友会发现，标题栏左侧有一个小三角形。通过点击这个图标，我们可以完成一个收缩功能，这就是行为，也是与页面内容无关的东西。

三种角色负责三个不同的分工，尽量不要去相互影响。