页面显示HTML代码

页面显示HTML代码：

看到一个CSS的颜色大全，想收藏起来，以便以后用到，但又不想保存为word形式，打开麻烦；我想干保存为html形式；但是html页面是不能直接显示html代码的，于是在网上查了一下，作了以下的总结：

比如：<div>对html的用法作个说明</div>
           <div><span id="demo">奇迹</span></div>
第一种方法：
“<”用&lt;表示
“>”用&gt;表示
“"”用&quot;表示

第二种方法：
使用<pre></pre>包围代码（在浏览器中测试不行啊，但是在富编辑器中又可以，怪）；
使用<xmp></xmp>包围代码（官方不推荐，但是效果不错哦，在firefox和IE都可以）；
使用<textarea></textarea>包围代码（在富编辑器和浏览器中均可以 ）；

<pre>不能在页面显示；<xmp>不错，可行；<textarea>是在文本域中显示，达不到想要的效果。

<xmp>
    <div>对html的用法作个说明</div>
    <div><span id="demo">奇迹</span></div>
</xmp>