﻿<?xml version="1.0" encoding="utf-8" standalone="yes"?><rss version="2.0" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/" xmlns:wfw="http://wellformedweb.org/CommentAPI/" xmlns:slash="http://purl.org/rss/1.0/modules/slash/"><channel><title>BlogJava-小毅的遐想-文章分类-css</title><link>http://www.blogjava.net/xiaoyi/category/33891.html</link><description>阳光总在风雨后,让我们在雨中毅然前行,收获每一份喜悦的欢笑o(∩_∩)o...</description><language>zh-cn</language><lastBuildDate>Tue, 15 Sep 2009 08:54:04 GMT</lastBuildDate><pubDate>Tue, 15 Sep 2009 08:54:04 GMT</pubDate><ttl>60</ttl><item><title>小毅整理之------CSS选择器</title><link>http://www.blogjava.net/xiaoyi/articles/294519.html</link><dc:creator>可爱的小毅</dc:creator><author>可爱的小毅</author><pubDate>Wed, 09 Sep 2009 16:42:00 GMT</pubDate><guid>http://www.blogjava.net/xiaoyi/articles/294519.html</guid><wfw:comment>http://www.blogjava.net/xiaoyi/comments/294519.html</wfw:comment><comments>http://www.blogjava.net/xiaoyi/articles/294519.html#Feedback</comments><slash:comments>0</slash:comments><wfw:commentRss>http://www.blogjava.net/xiaoyi/comments/commentRss/294519.html</wfw:commentRss><trackback:ping>http://www.blogjava.net/xiaoyi/services/trackbacks/294519.html</trackback:ping><description><![CDATA[一直对这个地方糊里糊涂，这次借了一本书，争取将css强化一下.<br />
CSS的几种选择器：<br />
<ul>
    <li>标记选择器： </li>
</ul>
&nbsp;&nbsp;&nbsp; 定义html或者xhtml标签的通用CSS样式，定义语句前无前缀。例如：<br />
<div style="border-right: #cccccc 1px solid; padding-right: 5px; border-top: #cccccc 1px solid; padding-left: 4px; font-size: 13px; padding-bottom: 4px; border-left: #cccccc 1px solid; width: 98%; padding-top: 4px; border-bottom: #cccccc 1px solid; background-color: #eeeeee"><!--<br />
<br />
Code highlighting produced by Actipro CodeHighlighter (freeware)<br />
http://www.CodeHighlighter.com/<br />
<br />
--><span style="color: #800000">&lt;style&gt;<br />
h1</span><span style="color: #000000">{</span><span style="color: #ff0000"><br />
&nbsp;&nbsp;color</span><span style="color: #000000">:</span><span style="color: #0000ff">red<br />
</span><span style="color: #000000">}</span><span style="color: #800000"><br />
&lt;/style&gt;<br />
&lt;h1&gt;This is test.&lt;/h1&gt;<br />
</span></div>
<br />
<ul>
    <li>类别选择器： </li>
</ul>
&nbsp;&nbsp;&nbsp; 通过定义单独的class来定义对应样式，定义语句前缀为 '.'。例如：<br />
<div style="border-right: #cccccc 1px solid; padding-right: 5px; border-top: #cccccc 1px solid; padding-left: 4px; font-size: 13px; padding-bottom: 4px; border-left: #cccccc 1px solid; width: 98%; padding-top: 4px; border-bottom: #cccccc 1px solid; background-color: #eeeeee"><!--<br />
<br />
Code highlighting produced by Actipro CodeHighlighter (freeware)<br />
http://www.CodeHighlighter.com/<br />
<br />
--><span style="color: #800000">&lt;style&gt;<br />
.red</span><span style="color: #000000">{</span><span style="color: #ff0000"><br />
&nbsp;&nbsp;color</span><span style="color: #000000">:</span><span style="color: #0000ff">red<br />
</span><span style="color: #000000">}</span><span style="color: #800000"><br />
&lt;/style&gt;<br />
&lt;p class="red"&gt;xxxxxx&lt;/p&gt;<br />
</span></div>
<br />
<ul>
    <li>ID选择器： </li>
</ul>
&nbsp;&nbsp;&nbsp; 通过对应html元素的标签ID来定义对应样式，定义语句前缀为 '#'。例如：<br />
<div style="border-right: #cccccc 1px solid; padding-right: 5px; border-top: #cccccc 1px solid; padding-left: 4px; font-size: 13px; padding-bottom: 4px; border-left: #cccccc 1px solid; width: 98%; padding-top: 4px; border-bottom: #cccccc 1px solid; background-color: #eeeeee"><!--<br />
<br />
Code highlighting produced by Actipro CodeHighlighter (freeware)<br />
http://www.CodeHighlighter.com/<br />
<br />
--><span style="color: #800000">&lt;style&gt;<br />
#</span><span style="color: #800000">firstPar</span><span style="color: #000000">{</span><span style="color: #ff0000"><br />
&nbsp;&nbsp;color</span><span style="color: #000000">:</span><span style="color: #0000ff">red<br />
</span><span style="color: #000000">}</span><span style="color: #800000"><br />
&lt;/style&gt;<br />
</span><span style="color: #800000">&lt;p id="firstPar"&gt;xxxxxx&lt;/p&gt;</span><br />
</div>
<br />
<ul>
    <li>复合选择器: </li>
</ul>
<br />
另外，可以通过这几种选择器组合定义复合选择器，例如：<br />
<div style="border-right: #cccccc 1px solid; padding-right: 5px; border-top: #cccccc 1px solid; padding-left: 4px; font-size: 13px; padding-bottom: 4px; border-left: #cccccc 1px solid; width: 98%; padding-top: 4px; border-bottom: #cccccc 1px solid; background-color: #eeeeee"><!--<br />
<br />
Code highlighting produced by Actipro CodeHighlighter (freeware)<br />
http://www.CodeHighlighter.com/<br />
<br />
--><span style="color: #800000">&lt;style&gt;<br />
p</span><span style="color: #000000">{</span><span style="color: #ff0000"><br />
&nbsp;&nbsp;color</span><span style="color: #000000">:</span><span style="color: #0000ff">red<br />
</span><span style="color: #000000">}</span><span style="color: #800000"><br />
p&nbsp;.firstPar</span><span style="color: #000000">{</span><span style="color: #ff0000"><br />
&nbsp;&nbsp;color</span><span style="color: #000000">:</span><span style="color: #0000ff">blue<br />
</span><span style="color: #000000">}</span><span style="color: #800000"><br />
.firstPar</span><span style="color: #000000">{</span><span style="color: #ff0000"><br />
&nbsp;&nbsp;color</span><span style="color: #000000">:</span><span style="color: #0000ff">green<br />
</span><span style="color: #000000">}</span><span style="color: #800000"><br />
&lt;/style&gt;<br />
&lt;p&gt;普通段落&lt;/p&gt;<br />
&lt;p&nbsp;class="firstPar"&gt;第一段&lt;/p&gt;<br />
&lt;h1&nbsp;class="firstPar"&gt;第一段标题&lt;/h1&gt;</span></div>
<br />
<ul>
    <li>全局选择器： </li>
</ul>
如果想要一个页面中所有html标记使用同一种样式，可以定义一种全局选择器： '*'。例如：<br />
<div style="border-right: #cccccc 1px solid; padding-right: 5px; border-top: #cccccc 1px solid; padding-left: 4px; font-size: 13px; padding-bottom: 4px; border-left: #cccccc 1px solid; width: 98%; padding-top: 4px; border-bottom: #cccccc 1px solid; background-color: #eeeeee"><!--<br />
<br />
Code highlighting produced by Actipro CodeHighlighter (freeware)<br />
http://www.CodeHighlighter.com/<br />
<br />
--><span style="color: #800000">&lt;style&gt;<br />
*</span><span style="color: #000000">{</span><span style="color: #ff0000"><br />
&nbsp;&nbsp;color</span><span style="color: #000000">:</span><span style="color: #0000ff">red</span><span style="color: #000000">;</span><span style="color: #ff0000"><br />
&nbsp;&nbsp;font-size</span><span style="color: #000000">:</span><span style="color: #0000ff">10px<br />
</span><span style="color: #000000">}</span><span style="color: #800000"><br />
&lt;/style&gt;<br />
&lt;p&gt;普通段落&lt;/p&gt;<br />
&lt;p&gt;第一段&lt;/p&gt;<br />
&lt;h1&gt;第一段标题&lt;/h1&gt;</span></div>
<br />
<ul>
    <li>后代选择器： </li>
</ul>
可以通过嵌套的方式，对特殊位置的html标记进行声明。后代选择器的写法就是把外层的标记写在前面，内层的标记写在后面，之间用空格分隔。当标记发生嵌套时，内层的标记就成为外层标记的后代。例如：<br />
<div style="border-right: #cccccc 1px solid; padding-right: 5px; border-top: #cccccc 1px solid; padding-left: 4px; font-size: 13px; padding-bottom: 4px; border-left: #cccccc 1px solid; width: 98%; padding-top: 4px; border-bottom: #cccccc 1px solid; background-color: #eeeeee"><!--<br />
<br />
Code highlighting produced by Actipro CodeHighlighter (freeware)<br />
http://www.CodeHighlighter.com/<br />
<br />
--><span style="color: #800000">&lt;style&gt;<br />
p&nbsp;span</span><span style="color: #000000">{</span><span style="color: #ff0000"><br />
&nbsp;&nbsp;color</span><span style="color: #000000">:</span><span style="color: #0000ff">red</span><span style="color: #000000">;</span><span style="color: #ff0000"><br />
&nbsp;&nbsp;font-size</span><span style="color: #000000">:</span><span style="color: #0000ff">10px<br />
</span><span style="color: #000000">}</span><span style="color: #800000"><br />
span</span><span style="color: #000000">{</span><span style="color: #ff0000"><br />
&nbsp;&nbsp;color</span><span style="color: #000000">:</span><span style="color: #0000ff">green<br />
</span><span style="color: #000000">}</span><span style="color: #800000"><br />
&lt;/style&gt;<br />
&lt;p&gt;嵌套使&lt;span&gt;用CSS&lt;/span&gt;标记的方法&lt;/p&gt;<br />
嵌套之外的&lt;span&gt;标记&lt;/span&gt;不生效</span></div>
<img src ="http://www.blogjava.net/xiaoyi/aggbug/294519.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.blogjava.net/xiaoyi/" target="_blank">可爱的小毅</a> 2009-09-10 00:42 <a href="http://www.blogjava.net/xiaoyi/articles/294519.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item><item><title>小毅收藏之------css样式表的使用技巧</title><link>http://www.blogjava.net/xiaoyi/articles/280362.html</link><dc:creator>可爱的小毅</dc:creator><author>可爱的小毅</author><pubDate>Sat, 06 Jun 2009 12:28:00 GMT</pubDate><guid>http://www.blogjava.net/xiaoyi/articles/280362.html</guid><wfw:comment>http://www.blogjava.net/xiaoyi/comments/280362.html</wfw:comment><comments>http://www.blogjava.net/xiaoyi/articles/280362.html#Feedback</comments><slash:comments>0</slash:comments><wfw:commentRss>http://www.blogjava.net/xiaoyi/comments/commentRss/280362.html</wfw:commentRss><trackback:ping>http://www.blogjava.net/xiaoyi/services/trackbacks/280362.html</trackback:ping><description><![CDATA[<div class="postbody"><span style="font-family: 宋体"><strong style="color: red">css样式表的使用技巧【一】 <br />
</strong>这篇文章总结了我在使用</span>CSS<span style="font-family: 宋体">布局方法以来所有的技巧和兼容方案，我会重点解释一些新手容易犯的错误</span><span style="font-family: 宋体">，我希望吧这些小技巧，或者说是一些应该注意的地方和大家分享。如果你已经是</span>CSS<span style="font-family: 宋体">高手，这些经验技巧可能已经都知道，如果你有更多的，希望可以帮我补充<img alt="" src="http://www.cnblogs.com/Emoticons/yoyocici/224025633.gif" />。</span>
<p>&nbsp;</p>
<p>&nbsp;<span style="font-family: 宋体">一</span>.<span style="font-family: 宋体">使用</span>css<span style="font-family: 宋体">缩写</span></p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">使用缩写可以帮助减少你</span>CSS<span style="font-family: 宋体">文件的大小，更加容易阅读。</span></p>
<p>&nbsp;</p>
<p>css<span style="font-family: 宋体">缩写的主要规则如下：</span></p>
<p>&nbsp;</p>
<p>&nbsp;<span style="font-family: 宋体">颜色</span></p>
<p>&nbsp;</p>
<p>&nbsp;16<span style="font-family: 宋体">进制的色彩值，如果每两位的值相同，可以缩写一半，例如：</span></p>
<p>&nbsp;</p>
<p>#000000<span style="font-family: 宋体">可以缩写为</span>#000;#336699<span style="font-family: 宋体">可以缩写为</span>#369;</p>
<p>&nbsp;</p>
<p>&nbsp;<span style="font-family: 宋体">盒尺寸</span></p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">通常有下面四种书写方法</span>:</p>
<p>&nbsp;</p>
<p>&nbsp;property:value1; <span style="font-family: 宋体">表示所有边都是一个值</span>value1<span style="font-family: 宋体">；</span></p>
<p>&nbsp;</p>
<p>property:value1 value2; <span style="font-family: 宋体">表示</span>top<span style="font-family: 宋体">和</span>bottom<span style="font-family: 宋体">的值是</span>value1,right<span style="font-family: 宋体">和</span>left<span style="font-family: 宋体">的值是</span>value2</p>
<p>&nbsp;</p>
<p>property:value1 value2 value3; <span style="font-family: 宋体">表示</span>top<span style="font-family: 宋体">的值是</span>value1<span style="font-family: 宋体">，</span>right<span style="font-family: 宋体">和</span>left<span style="font-family: 宋体">的值是</span>value2<span style="font-family: 宋体">，</span>bottom<span style="font-family: 宋体">的值是</span>value3</p>
<p>&nbsp;</p>
<p>property:value1 value2 value3 value4; <span style="font-family: 宋体">四个值依次表示</span>top,right,bottom,left</p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">方便的记忆方法是顺时针，上右下左。具体应用在</span>margin<span style="font-family: 宋体">和</span>padding<span style="font-family: 宋体">的例子如下：</span></p>
<p>&nbsp;</p>
<p>margin:1em 0 2em 0.5em;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">边框</span>(border)</p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">边框的属性如下：</span></p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>border-width:1px;</p>
<p>&nbsp;</p>
<p>border-style:solid;</p>
<p>&nbsp;</p>
<p>border-color:#000;</p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">可以缩写为一句：</span>border:1px solid #000;</p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">语法是</span>border:width style color;</p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">背景</span>(Backgrounds)</p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">背景的属性如下：</span></p>
<p>&nbsp;</p>
<p>background-color:#f00;</p>
<p>&nbsp;</p>
<p>background-image:url(background.gif);</p>
<p>&nbsp;</p>
<p>background-repeat:no-repeat;</p>
<p>&nbsp;</p>
<p>background-attachment:fixed;</p>
<p>&nbsp;</p>
<p>background-position:0 0;</p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">可以缩写为一句：</span>background:#f00 url(background.gif) no-repeat fixed 0 0;</p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">语法是</span>background:color image repeat attachment position;</p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">你可以省略其中一个或多个属性值，如果省略，该属性值将用浏览器默认值，默认值为：</span></p>
<p>&nbsp;</p>
<p>color: transparent</p>
<p>&nbsp;</p>
<p>image: none</p>
<p>&nbsp;</p>
<p>repeat: repeat</p>
<p>&nbsp;</p>
<p>attachment: scroll</p>
<p>&nbsp;</p>
<p>position: 0% 0%</p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">字体</span>(fonts)</p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">字体的属性如下：</span></p>
<p>&nbsp;</p>
<p>font-style:italic;</p>
<p>&nbsp;</p>
<p>font-variant:small-caps;</p>
<p>&nbsp;</p>
<p>font-weight:bold;</p>
<p>&nbsp;</p>
<p>font-size:1em;</p>
<p>&nbsp;</p>
<p>line-height:140%;</p>
<p>&nbsp;</p>
<p>font-family:"Lucida Grande",sans-serif;</p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">可以缩写为一句：</span>font:italic small-caps bold 1em/140% "Lucida Grande",sans-serif;</p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">注意，如果你缩写字体定义，至少要定义</span>font-size<span style="font-family: 宋体">和</span>font-family<span style="font-family: 宋体">两个值。</span></p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">列表</span>(lists)</p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">取消默认的圆点和序号可以这样写</span>list-style:none;,</p>
<p>&nbsp;</p>
<p>list<span style="font-family: 宋体">的属性如下</span>:</p>
<p>&nbsp;</p>
<p>list-style-type:square;</p>
<p>&nbsp;</p>
<p>list-style-position:inside;</p>
<p>&nbsp;</p>
<p>list-style-image:url(image.gif);</p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">可以缩写为一句：</span>list-style:square inside url(image.gif);</p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">二</span>.<span style="font-family: 宋体">明确定义单位，除非值为</span>0</p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">在</span>HTML<span style="font-family: 宋体">中你可以只写</span>width="100"<span style="font-family: 宋体">，但是在</span>CSS<span style="font-family: 宋体">中，你必须给一个准确的单位，比如：</span>width:100px width:100em<span style="font-family: 宋体">。只有两个例外情况可以不定义单位：行高和</span>0<span style="font-family: 宋体">值。除此以外，其他值都必须紧跟单位，不要在数值和单位之间加空格。</span></p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">三</span>.<span style="font-family: 宋体">区分大小写</span></p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">当在</span>XHTML<span style="font-family: 宋体">中使用</span>CSS<span style="font-family: 宋体">，</span>CSS<span style="font-family: 宋体">里定义的元素名称是区分大小写的。为了避免这种错误，我建议所有的定义名称都采用小写。</span></p>
<p>&nbsp;</p>
<p>class<span style="font-family: 宋体">和</span>id<span style="font-family: 宋体">的值在</span>HTML<span style="font-family: 宋体">和</span>XHTML<span style="font-family: 宋体">中也是区分大小写的，如果你一定要大小写混合写，请仔细确认你在</span>CSS<span style="font-family: 宋体">的定义和</span>XHTML<span style="font-family: 宋体">里的标签是一致的。</span></p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">四</span>.<span style="font-family: 宋体">取消</span>class<span style="font-family: 宋体">和</span>id<span style="font-family: 宋体">前的元素限定</span></p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">当你写给一个元素定义</span>class<span style="font-family: 宋体">或者</span>id<span style="font-family: 宋体">，你可以省略前面的元素限定，因为</span>ID<span style="font-family: 宋体">在一个页面里是唯一的，而</span>clas s<span style="font-family: 宋体">可以在页面中多次使用。你限定某个元素毫无意义。例如：</span></p>
<p>&nbsp;</p>
<p>div#content { /* declarations */ } </p>
<p>&nbsp;</p>
<p>fieldset.details { /* declarations */ } </p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">可以写成</span></p>
<p>&nbsp;</p>
<p>#content { /* declarations */ } </p>
<p>&nbsp;</p>
<p>.details { /* declarations */ } </p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">这样可以节省一些字节。</span></p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;第一讲到此结束，谢谢大家！<img alt="" src="http://www.cnblogs.com/Emoticons/yoyocici/cool.gif" /><br />
<br />
<strong style="color: red"><br />
<br />
</strong></p>
</div>
<span style="font-family: 宋体"><strong style="color: red">css样式表的使用技巧【二】 </strong><br />
五</span>.<span style="font-family: 宋体">默认值</span>
<p><span style="font-family: 宋体">通常</span>padding<span style="font-family: 宋体">的默认值为</span>0<span style="font-family: 宋体">，</span>background-color<span style="font-family: 宋体">的默认值是</span>transparent<span style="font-family: 宋体">。但是在不同的浏览器默认值可能不同。如果怕有冲突，可以在样式表一开始就先定义所有元素的</span>margin<span style="font-family: 宋体">和</span>padding<span style="font-family: 宋体">值都为</span>0<span style="font-family: 宋体">，象这样：</span></p>
<p>* { </p>
<p>margin:0; </p>
<p>padding:0; </p>
<p>} </p>
<p><span style="font-family: 宋体">六</span>.<span style="font-family: 宋体">不需要重复定义可继承的值</span></p>
<p>CSS<span style="font-family: 宋体">中，子元素自动继承父元素的属性值，象颜色、字体等，已经在父元素中定义过的，在子元素中可以直接继承，不需要重复定义。但是要注意，浏览器可能用一些默认值覆盖你的定义。</span></p>
<p><span style="font-family: 宋体">七</span>.<span style="font-family: 宋体">最近优先原则</span></p>
<p><span style="font-family: 宋体">如果对同一个元素的定义有多种，以最接近</span>(<span style="font-family: 宋体">最小一级</span>)<span style="font-family: 宋体">的定义为最优先，例如</span></p>
<p><span style="font-family: 宋体">在</span>CSS<span style="font-family: 宋体">文件中，你已经定义了元素</span>p<span style="font-family: 宋体">，又定义了一个</span>class"update"</p>
<p>p { </p>
<p>margin:1em 0; </p>
<p>font-size:1em; </p>
<p>color:#333; </p>
<p>} </p>
<p>.update { </p>
<p>font-weight:bold; </p>
<p>color:#600; </p>
<p>} </p>
<p>&nbsp;<span style="font-family: 宋体">这两个定义中，</span>class="update"<span style="font-family: 宋体">将被使用</span></p>
<p>FF:&nbsp;&nbsp; ID<span style="font-family: 宋体">选择器</span>(<span style="font-family: 宋体">形如</span>#divMain{}) &gt; <span style="font-family: 宋体">类</span>(<span style="font-family: 宋体">形如</span>.divSpecial{}) &gt; <span style="font-family: 宋体">标签</span>(<span style="font-family: 宋体">形如</span>body{}) </p>
<p>IE:&nbsp;&nbsp;&nbsp; <span style="font-family: 宋体">类</span> &gt; ID<span style="font-family: 宋体">选择器</span> &gt; <span style="font-family: 宋体">标签。</span></p>
<p>&nbsp;第二讲到此结束，谢谢大家看啊！<br />
<br />
<span style="color: red"><strong>css样式表的使用技巧【三】 <br />
</strong></p>
<div class="postbody" style="color: #000000">
<p>接上篇讲&nbsp;：</p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">八</span>.<span style="font-family: 宋体">多重</span>class<span style="font-family: 宋体">定义</span></p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">一个标签可以同时定义多个</span>class<span style="font-family: 宋体">。例如：我们先定义两个样式，第一个样式背景为</span>#666<span style="font-family: 宋体">；第二个样式有</span>10 px<span style="font-family: 宋体">的边框。</span></p>
<p>&nbsp;</p>
<p>.one{width:200px;background:#666;}</p>
<p>&nbsp;</p>
<p>.two{border:10px solid #F00;} </p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">在页面代码中，我们可以这样调用</span></p>
<p>&nbsp;</p>
<p>&lt;div class="one two"&gt;&lt;/div&gt; </p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">这样最终的显示效果是这个</span>div<span style="font-family: 宋体">既有</span>#666<span style="font-family: 宋体">的背景，也有</span>10px<span style="font-family: 宋体">的边框。</span></p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">九</span>.<span style="font-family: 宋体">使用子选择器</span>(descendant selectors)</p>
<p>&nbsp;</p>
<p>CSS<span style="font-family: 宋体">初学者不知道使用子选择器是影响他们效率的原因之一。子选择器可以帮助你节约大量的</span>class<span style="font-family: 宋体">定义。我们来看下面这段代码：</span></p>
<p>&nbsp;</p>
<p>&lt;div id="subnav"&gt; </p>
<p>&nbsp;</p>
<p>&lt;ul&gt; </p>
<p>&nbsp;</p>
<p>&lt;li class="subnavitem"&gt; &lt;a href="#" class="subnavitem"&gt;Item 1&lt;/a&gt;&lt;/li&gt;&gt; </p>
<p>&nbsp;</p>
<p>&lt;li class="subnavitemselected"&gt; &lt;a href="#" class="subnavitemselected"&gt; Item 1&lt;/a&gt; &lt;/li&gt; </p>
<p>&nbsp;</p>
<p>&lt;li class="subnavitem"&gt; &lt;a href="#" class="subnavitem"&gt; Item 1&lt;/a&gt; &lt;/li&gt;</p>
<p>&nbsp;</p>
<p>&lt;/ul&gt; </p>
<p>&nbsp;</p>
<p>&lt;/div&gt; </p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">这段代码的</span>CSS<span style="font-family: 宋体">定义是：</span></p>
<p>&nbsp;</p>
<p>div#subnav ul { /* Some styling */ } </p>
<p>&nbsp;</p>
<p>div#subnav ul li.subnavitem { /* Some styling */ } </p>
<p>&nbsp;</p>
<p>&nbsp;div#subnav ul li.subnavitem a.subnavitem { /* Some styling */ } </p>
<p>&nbsp;</p>
<p>&nbsp;div#subnav ul li.subnavitemselected { /* Some styling */ } </p>
<p>&nbsp;</p>
<p>div#subnav ul li.subnavitemselected a.subnavitemselected { /* Some styling */ } </p>
<p>&nbsp;</p>
<p>&nbsp;<span style="font-family: 宋体">你可以用下面的方法替代上面的代码</span></p>
<p>&nbsp;</p>
<p>&nbsp;&lt;ul id="subnav"&gt; </p>
<p>&nbsp;</p>
<p>&nbsp;&lt;li&gt; &lt;a href="#"&gt; Item 1&lt;/a&gt; &lt;/li&gt; </p>
<p>&nbsp;</p>
<p>&nbsp;&lt;li class="sel"&gt; &lt;a href="#"&gt; Item 1&lt;/a&gt; &lt;/li&gt; </p>
<p>&nbsp;</p>
<p>&nbsp;&lt;li&gt; &lt;a href="#"&gt; Item 1&lt;/a&gt; &lt;/li&gt; </p>
<p>&nbsp;</p>
<p>&nbsp;&lt;/ul&gt; </p>
<p>&nbsp;</p>
<p>&nbsp;<span style="font-family: 宋体">样式定义是：</span></p>
<p>&nbsp;</p>
<p>&nbsp;#subnav { /* Some styling */ } </p>
<p>&nbsp;</p>
<p>&nbsp;#subnav li { /* Some styling */ } </p>
<p>&nbsp;</p>
<p>&nbsp;#subnav a { /* Some styling */ } </p>
<p>&nbsp;</p>
<p>&nbsp;#subnav .sel { /* Some styling */ } </p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>#subnav .sel a { /* Some styling */ } </p>
<p>&nbsp;</p>
<p>&nbsp;<span style="font-family: 宋体">用子选择器可以使你的代码和</span>CSS<span style="font-family: 宋体">更加简洁、更加容易阅读。</span></p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;<span style="font-family: 宋体">十</span>.<span style="font-family: 宋体">不需要给背景图片路径加引号</span></p>
<p>&nbsp;</p>
<p>&nbsp;<span style="font-family: 宋体">为了节省字节，我建议不要给背景图片路径加引号，因为引号不是必须的。例如：</span></p>
<p>&nbsp;</p>
<p>&nbsp;background:url("images/***.gif") #333; </p>
<p>&nbsp;</p>
<p>&nbsp;<span style="font-family: 宋体">可以写为</span></p>
<p>&nbsp;</p>
<p>&nbsp;background:url(images/***.gif) #333; </p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;<span style="font-family: 宋体">如果你加了引号，反而会引起一些浏览器的错误。</span></p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">十一</span>.<span style="font-family: 宋体">组选择器</span>(Group selectors)</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">当一些元素类型、</span>class<span style="font-family: 宋体">或者</span>id<span style="font-family: 宋体">都有共同的一些属性，你就可以使用组选择器来避免多次的重复定义。这可以节省不少字节。</span></p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">例如：定义所有标题的字体、颜色和</span>margin<span style="font-family: 宋体">，你可以这样写：</span></p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>h1,h2,h3,h4,h5,h6 { </p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>font-family:"Lucida Grande",Lucida,Arial,Helvetica,sans-serif; </p>
<p>&nbsp;</p>
<p>&nbsp;color:#333; </p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;margin:1em 0; </p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>} </p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">如果在使用时，有个别元素需要定义独立样式，你可以再加上新的定义，可以覆盖老的定义，例如：</span></p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;h1 { font-size:2em; } </p>
<p>&nbsp;</p>
<p>&nbsp;h2 { font-size:1.6em; } </p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">十二</span>.<span style="font-family: 宋体">用正确的顺序指定链接的样式</span></p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">当你用</span>CSS<span style="font-family: 宋体">来定义链接的多个状态样式时，要注意它们书写的顺序，正确的顺序是：</span>:link :visited :hover :active<span style="font-family: 宋体">。抽取第一个字母是</span>"LVHA"<span style="font-family: 宋体">，你可以记忆成</span>"LoVe HAte"(<span style="font-family: 宋体">喜欢讨厌</span>)<span style="font-family: 宋体">。为什么这么定义，可以参考</span>Eric Meyer<span style="font-family: 宋体">的《</span>Link Specificity<span style="font-family: 宋体">》。</span></p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p><span style="font-family: 宋体">如果你的用户需要用键盘来控制，需要知道当前链接的焦点，你还可以定义</span>:focus<span style="font-family: 宋体">属性。</span>:focus<span style="font-family: 宋体">属性的效果也取决与你书写的位置，如果你希望聚焦元素显示</span>:hover<span style="font-family: 宋体">效果，你就把</span>:focus<span style="font-family: 宋体">写在</span>:hover<span style="font-family: 宋体">前面</span>;<span style="font-family: 宋体">如果你希望聚焦效果替代</span>:hover<span style="font-family: 宋体">效果，你就把</span>:focus<span style="font-family: 宋体">放在</span>:hover<span style="font-family: 宋体">后面。</span></p>
<p>第三讲完毕，请达人多多指点！</p>
</div>
<span style="color: #000000"><strong><span style="color: #ff0000"><strong>css样式表的使用技巧【四】</strong> </span></strong><br />
<div>
<p>&nbsp;<img alt="" src="http://www.cnblogs.com/Emoticons/yoyocici/224023586.gif" />接上期继续！</p>
<p><span style="font-family: 宋体">十三</span>.<span style="font-family: 宋体">清除浮动</span></p>
<p>&nbsp;<span style="font-family: 宋体">一个非常常见的</span>CSS<span style="font-family: 宋体">问题，定位使用浮动的时候，下面的层被浮动的层所覆盖，或者层里嵌套的子层超出了外层的范围。</span></p>
<p>&nbsp;<span style="font-family: 宋体">通常的解决办法是在浮动层后面添加一个额外元素，例如一个</span>div<span style="font-family: 宋体">或者一个</span>br<span style="font-family: 宋体">，并且定义它的样式为</span>clear: both<span style="font-family: 宋体">。这个办法有一点牵强，幸运的是还有一个好办法可以解决，</span></p>
<p>&nbsp;<span style="font-family: 宋体">上面</span>2<span style="font-family: 宋体">种方法可以很好解决浮动超出的问题，但是如果当你真的需要对层或者层里的对象进行</span>clear<span style="font-family: 宋体">的时候怎么办</span>?<span style="font-family: 宋体">一种简单的方法就是用</span>overflow<span style="font-family: 宋体">属性，这个方法最初的发表在《</span>Simple Clearing of Floats<span style="font-family: 宋体">》，又在《</span>Clearance<span style="font-family: 宋体">》和《</span>Super simple clearing floats<span style="font-family: 宋体">》中被广泛讨论。</span></p>
<p>&nbsp;<span style="font-family: 宋体">上面那一种</span>clear<span style="font-family: 宋体">方法更适合你，要看具体的情况，这里不再展开论述。另外关于</span>float<span style="font-family: 宋体">的应用，一些优秀的文章已经说得很清楚，推荐你阅读：《</span>Floatutorial<span style="font-family: 宋体">》、《</span>Containing Floats<span style="font-family: 宋体">》和《</span>Float Layouts<span style="font-family: 宋体">》</span></p>
<p><span style="font-family: 宋体">十四</span>.<span style="font-family: 宋体">横向居中</span>(centering)</p>
<p><span style="font-family: 宋体">这是一个简单的技巧，但是值得再说一遍，因为我看见太多的新手问题都是问这个：</span>CSS<span style="font-family: 宋体">如何横向居中</span>?<span style="font-family: 宋体">你需要定义元素的宽，并且定义横向的</span>margin<span style="font-family: 宋体">，如果你的布局包含在一个层</span>(<span style="font-family: 宋体">容器</span>)<span style="font-family: 宋体">中，就象这样：</span></p>
<p><span style="font-family: 宋体">你可以这样定义使它横向居中：</span></p>
<p>#wrap {</p>
<p>width:760px; /* <span style="font-family: 宋体">修改为你的层的宽度</span> */</p>
<p>margin:0 auto;</p>
<p>}</p>
<p><span style="font-family: 宋体">但是</span>IE5/Win<span style="font-family: 宋体">不能正确显示这个定义，我们采用一个非常有用的技巧来解决：用</span>text-align<span style="font-family: 宋体">属性。就象这样：</span></p>
<p>body {</p>
<p>text-align:center;</p>
<p>}</p>
<p>#wrap {</p>
<p>width:760px; /* <span style="font-family: 宋体">修改为你的层的宽度</span> */</p>
<p>margin:0 auto;</p>
<p>text-align:left;</p>
<p>}</p>
<p><span style="font-family: 宋体">第一个</span>body<span style="font-family: 宋体">的</span>text-align:center; <span style="font-family: 宋体">规则定义</span>IE5/Win<span style="font-family: 宋体">中</span>body<span style="font-family: 宋体">的所有元素居中</span>(<span style="font-family: 宋体">其他浏览器只是将文字居中</span>) <span style="font-family: 宋体">，第二个</span>text-align:left;<span style="font-family: 宋体">是将</span>#warp<span style="font-family: 宋体">中的文字居左。</span></p>
<p><span style="font-family: 宋体">十五</span>.<span style="font-family: 宋体">导入</span>(Import)<span style="font-family: 宋体">和隐藏</span>CSS</p>
<p><span style="font-family: 宋体">因为老版本浏览器不支持</span>CSS<span style="font-family: 宋体">，一个通常的做法是使用</span>@import<span style="font-family: 宋体">技巧来把</span>CSS<span style="font-family: 宋体">隐藏起来。例如：</span></p>
<p>@import url("main.css");</p>
<p><span style="font-family: 宋体">然而，这个方法对</span>IE4<span style="font-family: 宋体">不起作用，这让我很是头疼了一阵子。后来我用这样的写法：</span></p>
<p>@import "main.css";</p>
<p><span style="font-family: 宋体">这样就可以在</span>IE4<span style="font-family: 宋体">中也隐藏</span>CSS<span style="font-family: 宋体">了，呵呵，还节省了</span>5<span style="font-family: 宋体">个字节呢。</span></p>
<p><span style="font-family: 宋体">&nbsp; </p>
<p><span style="font-family: 宋体">十六</span>.<span style="font-family: 宋体">针对</span>IE<span style="font-family: 宋体">的优化</span></p>
<p><span style="font-family: 宋体">有些时候，你需要对</span>IE<span style="font-family: 宋体">浏览器的</span>bug<span style="font-family: 宋体">定义一些特别的规则，这里有太多的</span>CSS<span style="font-family: 宋体">技巧</span>(hacks)<span style="font-family: 宋体">，我只使用其中的两种方法，不管微软在即将发布的</span>IE7 beta<span style="font-family: 宋体">版里是否更好的支持</span>CSS<span style="font-family: 宋体">，这两种方法都是最安全的。</span></p>
<p>1.<span style="font-family: 宋体">注释的方法</span></p>
<p>(a)<span style="font-family: 宋体">在</span>IE<span style="font-family: 宋体">中隐藏一个</span>CSS<span style="font-family: 宋体">定义，你可以使用子选择器</span>(child selector):</p>
<p>html&gt;body p {</p>
<p>/* <span style="font-family: 宋体">定义内容</span> */</p>
<p>}</p>
<p>(b)<span style="font-family: 宋体">下面这个写法只有</span>IE<span style="font-family: 宋体">浏览器可以理解</span>(<span style="font-family: 宋体">对其他浏览器都隐藏</span>)</p>
<p>* html p {</p>
<p>/* declarations */</p>
<p>}</p>
<p>(c)<span style="font-family: 宋体">还有些时候，你希望</span>IE/Win<span style="font-family: 宋体">有效而</span>IE/Mac<span style="font-family: 宋体">隐藏，你可以使用</span>"<span style="font-family: 宋体">反斜线</span>"<span style="font-family: 宋体">技巧：</span></p>
<p>/* "*/</p>
<p>* html p {</p>
<p>declarations</p>
<p>}</p>
<p>/* */</p>
<p>2.<span style="font-family: 宋体">条件注释</span>(conditional comments)<span style="font-family: 宋体">的方法</span></p>
<p><span style="font-family: 宋体">另外一种方法，我认为比</span>CSS<span style="font-family: 宋体">　</span>Hacks<span style="font-family: 宋体">更加经得起考验就是采用微软的私有属性条件注释</span>(conditional comments)<span style="font-family: 宋体">。用这个方法你可以给</span>IE<span style="font-family: 宋体">单独定义一些样式，而不影响主样式表的定义。就象这样：</span></p>
<p><span style="font-family: 宋体">十七</span>.<span style="font-family: 宋体">调试技巧：层有多大</span>?</p>
<p><span style="font-family: 宋体">当调试</span>CSS<span style="font-family: 宋体">发生错误，你就要象排版工人，逐行分析</span>CSS<span style="font-family: 宋体">代码。我通常在出问题的层上定义一个背景颜色，这样就能很明显看到层占据多大空间。有些人建议用</span>border<span style="font-family: 宋体">，一般情况也是可以的，但问题是，有时候</span>border <span style="font-family: 宋体">会增加元素的尺寸，</span>border-top<span style="font-family: 宋体">和</span>boeder-bottom<span style="font-family: 宋体">会破坏纵向</span>margin<span style="font-family: 宋体">的值，所以使用</span>background<span style="font-family: 宋体">更加安全些。</span></p>
<p><span style="font-family: 宋体">另外一个经常出问题的属性是</span>outline<span style="font-family: 宋体">。</span>outline<span style="font-family: 宋体">看起来象</span>boeder<span style="font-family: 宋体">，但不会影响元素的尺寸或者位置。只有少数浏览器支持</span>outline<span style="font-family: 宋体">属性，我所知道的只有</span>Safari<span style="font-family: 宋体">、</span>OmniWeb<span style="font-family: 宋体">、和</span>Opera<span style="font-family: 宋体">。</span></p>
<p><span style="font-family: 宋体">十八</span>.CSS<span style="font-family: 宋体">代码书写样式</span></p>
<p><span style="font-family: 宋体">在写</span>CSS<span style="font-family: 宋体">代码的时候，对于缩进、断行、空格，每个人有每个人的书写习惯。在经过不断实践后，我决定采用下面这样的书写样式：</span></p>
<p>selector1,</p>
<p>selector2 {</p>
<p>property:value;</p>
<p>}</p>
<p><span style="font-family: 宋体">当使用联合定义时，我通常将每个选择器单独写一行，这样方便在</span>CSS<span style="font-family: 宋体">文件中找到它们。在最后一个选择器和大括号</span>{<span style="font-family: 宋体">之间加一个空格，每个定义也单独写一行，分号直接在属性值后，不要加空格。</span></p>
<p><span style="font-family: 宋体">我习惯在每个属性值后面都加分号，虽然规则上允许最后一个属性值后面可以不写分号，但是如果你要加新样式时容易忘记补上分号而产生错误，所以还是都加比较好。</span></p>
<p><span style="font-family: 宋体">最后，关闭的大括号</span>}<span style="font-family: 宋体">单独写一行。空格和换行有助与阅读。</span></p>
<p>最后一讲结束，感谢大家来看贴！</p>
<p>祝大家工作愉快开心！谢谢！<img alt="" src="http://www.cnblogs.com/Emoticons/tusiji/203330988.gif" /></span></p>
</div>
</span></span>
<img src ="http://www.blogjava.net/xiaoyi/aggbug/280362.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.blogjava.net/xiaoyi/" target="_blank">可爱的小毅</a> 2009-06-06 20:28 <a href="http://www.blogjava.net/xiaoyi/articles/280362.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item><item><title>css发光字</title><link>http://www.blogjava.net/xiaoyi/articles/232056.html</link><dc:creator>可爱的小毅</dc:creator><author>可爱的小毅</author><pubDate>Wed, 01 Oct 2008 18:43:00 GMT</pubDate><guid>http://www.blogjava.net/xiaoyi/articles/232056.html</guid><wfw:comment>http://www.blogjava.net/xiaoyi/comments/232056.html</wfw:comment><comments>http://www.blogjava.net/xiaoyi/articles/232056.html#Feedback</comments><slash:comments>0</slash:comments><wfw:commentRss>http://www.blogjava.net/xiaoyi/comments/commentRss/232056.html</wfw:commentRss><trackback:ping>http://www.blogjava.net/xiaoyi/services/trackbacks/232056.html</trackback:ping><description><![CDATA[<p style="filter: glow(color:#DD002C,strength=3); color: #ffffff; height: 12px">css发光字就这么简单,字体颜色默认白色(#ffffff)比较好,#DD002C为发光颜色 </p>
<div style="border-right: #cccccc 1px solid; padding-right: 5px; border-top: #cccccc 1px solid; padding-left: 4px; font-size: 13px; padding-bottom: 4px; border-left: #cccccc 1px solid; width: 98%; word-break: break-all; padding-top: 4px; border-bottom: #cccccc 1px solid; background-color: #eeeeee"><img src="http://www.blogjava.net/images/OutliningIndicators/None.gif" align="top"  alt="" /><span style="color: #0000ff">&lt;</span><span style="color: #800000">p&nbsp;</span><span style="color: #ff0000">style</span><span style="color: #0000ff">="filter:glow(color:#DD002C,strength=3);&nbsp;height:12px;&nbsp;color:#ffffff;"</span><span style="color: #0000ff">&gt;</span><span style="color: #000000"><br />
<img src="http://www.blogjava.net/images/OutliningIndicators/None.gif" align="top"  alt="" />css发光字就这么简单,字体颜色默认白色(#ffffff)比较好,#DD002C为发光颜色</span></div>
<img src ="http://www.blogjava.net/xiaoyi/aggbug/232056.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.blogjava.net/xiaoyi/" target="_blank">可爱的小毅</a> 2008-10-02 02:43 <a href="http://www.blogjava.net/xiaoyi/articles/232056.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item><item><title>css颜色代码大全</title><link>http://www.blogjava.net/xiaoyi/articles/228878.html</link><dc:creator>可爱的小毅</dc:creator><author>可爱的小毅</author><pubDate>Sun, 14 Sep 2008 05:58:00 GMT</pubDate><guid>http://www.blogjava.net/xiaoyi/articles/228878.html</guid><wfw:comment>http://www.blogjava.net/xiaoyi/comments/228878.html</wfw:comment><comments>http://www.blogjava.net/xiaoyi/articles/228878.html#Feedback</comments><slash:comments>0</slash:comments><wfw:commentRss>http://www.blogjava.net/xiaoyi/comments/commentRss/228878.html</wfw:commentRss><trackback:ping>http://www.blogjava.net/xiaoyi/services/trackbacks/228878.html</trackback:ping><description><![CDATA[<p class="cnt" align="center">
<table border="0">
    <tbody>
        <tr>
            <td width="95" bgcolor="#ffffff" height="30"><font size="+0">FFFFFF</font></td>
            <td width="95" bgcolor="#dddddd" height="30"><font size="+0">#DDDDDD</font></td>
            <td width="95" bgcolor="#aaaaaa" height="30"><font color="#ffffff">#AAAAAA</font></td>
            <td width="95" bgcolor="#888888" height="30"><font color="#ffffff">#888888</font></td>
            <td width="95" bgcolor="#666666" height="30"><font color="#ffffff">#666666</font></td>
            <td width="95" bgcolor="#444444" height="30"><font color="#ffffff">#444444</font></td>
            <td width="95" bgcolor="#000000" height="30"><font color="#ffffff">#000000</font></td>
        </tr>
        <tr>
            <td width="95" bgcolor="#ffb7dd" height="30"><font size="+0">#FFB7DD</font></td>
            <td width="95" bgcolor="#ff88c2" height="30"><font size="+0">#FF88C2</font></td>
            <td width="95" bgcolor="#ff44aa" height="30"><font color="#ffffff">#FF44AA </font></td>
            <td width="95" bgcolor="#ff0088" height="30"><font color="#ffffff">#FF0088 </font></td>
            <td width="95" bgcolor="#c10066" height="30"><font color="#ffffff">#C10066 </font></td>
            <td width="95" bgcolor="#a20055" height="30"><font color="#ffffff">#A20055 </font></td>
            <td width="95" bgcolor="#8c0044" height="30"><font color="#ffffff">#8C0044 </font></td>
        </tr>
        <tr>
            <td width="95" bgcolor="#ffcccc" height="30"><font size="+0">#FFCCCC</font></td>
            <td width="95" bgcolor="#ff8888" height="30"><font size="+0">#FF8888</font></td>
            <td width="95" bgcolor="#ff3333" height="30"><font color="#ffffff">#FF3333 </font></td>
            <td width="95" bgcolor="#ff0000" height="30"><font color="#ffffff">#FF0000 </font></td>
            <td width="95" bgcolor="#cc0000" height="30"><font color="#ffffff">#CC0000 </font></td>
            <td width="95" bgcolor="#aa0000" height="30"><font color="#ffffff">#AA0000 </font></td>
            <td width="95" bgcolor="#880000" height="30"><font color="#ffffff">#880000 </font></td>
        </tr>
        <tr>
            <td width="95" bgcolor="#ffc8b4" height="30"><font size="+0">#FFC8B4</font></td>
            <td width="95" bgcolor="#ffa488" height="30"><font size="+0">#FFA488</font></td>
            <td width="95" bgcolor="#ff7744" height="30"><font color="#ffffff">#FF7744 </font></td>
            <td width="95" bgcolor="#ff5511" height="30"><font color="#ffffff">#FF5511 </font></td>
            <td width="95" bgcolor="#e63f00" height="30"><font color="#ffffff">#E63F00 </font></td>
            <td width="95" bgcolor="#c63300" height="30"><font color="#ffffff">#C63300 </font></td>
            <td width="95" bgcolor="#a42d00" height="30"><font color="#ffffff">#A42D00 </font></td>
        </tr>
        <tr>
            <td width="95" bgcolor="#ffddaa" height="30"><font size="+0">#FFDDAA</font></td>
            <td width="95" bgcolor="#ffbb66" height="30"><font size="+0">#FFBB66</font></td>
            <td width="95" bgcolor="#ffaa33" height="30"><font size="+0">#FFAA33</font></td>
            <td width="95" bgcolor="#ff8800" height="30"><font color="#ffffff">#FF8800 </font></td>
            <td width="95" bgcolor="#ee7700" height="30"><font color="#ffffff">#EE7700 </font></td>
            <td width="95" bgcolor="#cc6600" height="30"><font color="#ffffff">#CC6600 </font></td>
            <td width="95" bgcolor="#bb5500" height="30"><font color="#ffffff">#BB5500 </font></td>
        </tr>
        <tr>
            <td width="95" bgcolor="#ffee99" height="30"><font size="+0">#FFEE99</font></td>
            <td width="95" bgcolor="#ffdd55" height="30"><font size="+0">#FFDD55</font></td>
            <td width="95" bgcolor="#ffcc22" height="30"><font size="+0">#FFCC22</font></td>
            <td width="95" bgcolor="#ffbb00" height="30"><font color="#ffffff">#FFBB00 </font></td>
            <td width="95" bgcolor="#ddaa00" height="30"><font color="#ffffff">#DDAA00 </font></td>
            <td width="95" bgcolor="#aa7700" height="30"><font color="#ffffff">#AA7700 </font></td>
            <td width="95" bgcolor="#886600" height="30"><font color="#ffffff">#886600 </font></td>
        </tr>
        <tr>
            <td width="95" bgcolor="#ffffbb" height="30"><font size="+0">#FFFFBB</font></td>
            <td width="95" bgcolor="#ffff77" height="30"><font size="+0">#FFFF77</font></td>
            <td width="95" bgcolor="#ffff33" height="30"><font size="+0">#FFFF33</font></td>
            <td width="95" bgcolor="#ffff00" height="30"><font size="+0">#FFFF00</font></td>
            <td width="95" bgcolor="#eeee00" height="30"><font size="+0">#EEEE00</font></td>
            <td width="95" bgcolor="#bbbb00" height="30"><font color="#ffffff">#BBBB00</font></td>
            <td width="95" bgcolor="#888800" height="30"><font color="#ffffff">#888800</font></td>
        </tr>
        <tr>
            <td width="95" bgcolor="#eeffbb" height="30"><font size="+0">#EEFFBB</font></td>
            <td width="95" bgcolor="#ddff77" height="30"><font size="+0">#DDFF77</font></td>
            <td width="95" bgcolor="#ccff33" height="30"><font size="+0">#CCFF33</font></td>
            <td width="95" bgcolor="#bbff00" height="30"><font size="+0">#BBFF00</font></td>
            <td width="95" bgcolor="#99dd00" height="30"><font size="+0">#99DD00</font></td>
            <td width="95" bgcolor="#88aa00" height="30"><font color="#ffffff">#88AA00</font></td>
            <td width="95" bgcolor="#668800" height="30"><font color="#ffffff">#668800</font></td>
        </tr>
        <tr>
            <td width="95" bgcolor="#ccff99" height="30"><font size="+0">#CCFF99</font></td>
            <td width="95" bgcolor="#bbff66" height="30"><font size="+0">#BBFF66</font></td>
            <td width="95" bgcolor="#99ff33" height="30"><font size="+0">#99FF33</font></td>
            <td width="95" bgcolor="#77ff00" height="30"><font size="+0">#77FF00</font></td>
            <td width="95" bgcolor="#66dd00" height="30"><font size="+0">#66DD00</font></td>
            <td width="95" bgcolor="#55aa00" height="30"><font color="#ffffff">#55AA00</font></td>
            <td width="95" bgcolor="#227700" height="30"><font color="#ffffff">#227700</font></td>
        </tr>
        <tr>
            <td width="95" bgcolor="#99ff99" height="30"><font size="+0">#99FF99</font></td>
            <td width="95" bgcolor="#66ff66" height="30"><font size="+0">#66FF66</font></td>
            <td width="95" bgcolor="#33ff33" height="30"><font size="+0">#33FF33</font></td>
            <td width="95" bgcolor="#00ff00" height="30"><font size="+0">#00FF00</font></td>
            <td width="95" bgcolor="#00dd00" height="30"><font size="+0">#00DD00</font></td>
            <td width="95" bgcolor="#00aa00" height="30"><font color="#ffffff">#00AA00</font></td>
            <td width="95" bgcolor="#008800" height="30"><font color="#ffffff">#008800</font></td>
        </tr>
        <tr>
            <td width="95" bgcolor="#bbffee" height="30"><font size="+0">#BBFFEE</font></td>
            <td width="95" bgcolor="#77ffcc" height="30"><font size="+0">#77FFCC</font></td>
            <td width="95" bgcolor="#33ffaa" height="30"><font size="+0">#33FFAA</font></td>
            <td width="95" bgcolor="#00ff99" height="30"><font size="+0">#00FF99</font></td>
            <td width="95" bgcolor="#00dd77" height="30"><font size="+0">#00DD77</font></td>
            <td width="95" bgcolor="#00aa55" height="30"><font color="#ffffff">#00AA55</font></td>
            <td width="95" bgcolor="#008844" height="30"><font color="#ffffff">#008844</font></td>
        </tr>
        <tr>
            <td width="95" bgcolor="#aaffee" height="30"><font size="+0">#AAFFEE</font></td>
            <td width="95" bgcolor="#77ffee" height="30"><font size="+0">#77FFEE</font></td>
            <td width="95" bgcolor="#33ffdd" height="30"><font size="+0">#33FFDD</font></td>
            <td width="95" bgcolor="#00ffcc" height="30"><font size="+0">#00FFCC</font></td>
            <td width="95" bgcolor="#00ddaa" height="30"><font size="+0">#00DDAA</font></td>
            <td width="95" bgcolor="#00aa88" height="30"><font color="#ffffff">#00AA88</font></td>
            <td width="95" bgcolor="#008866" height="30"><font color="#ffffff">#008866</font></td>
        </tr>
        <tr>
            <td width="95" bgcolor="#99ffff" height="30"><font size="+0">#99FFFF</font></td>
            <td width="95" bgcolor="#66ffff" height="30"><font size="+0">#66FFFF</font></td>
            <td width="95" bgcolor="#33ffff" height="30"><font size="+0">#33FFFF</font></td>
            <td width="95" bgcolor="#00ffff" height="30"><font size="+0">#00FFFF</font></td>
            <td width="95" bgcolor="#00dddd" height="30"><font size="+0">#00DDDD</font></td>
            <td width="95" bgcolor="#00aaaa" height="30"><font color="#ffffff">#00AAAA</font></td>
            <td width="95" bgcolor="#008888" height="30"><font color="#ffffff">#008888</font></td>
        </tr>
        <tr>
            <td width="95" bgcolor="#cceeff" height="30"><font size="+0">#CCEEFF</font></td>
            <td width="95" bgcolor="#77ddff" height="30"><font size="+0">#77DDFF</font></td>
            <td width="95" bgcolor="#33ccff" height="30"><font size="+0">#33CCFF</font></td>
            <td width="95" bgcolor="#00bbff" height="30"><font size="+0">#00BBFF</font></td>
            <td width="95" bgcolor="#009fcc" height="30"><font color="#ffffff">#009FCC</font></td>
            <td width="95" bgcolor="#0088a8" height="30"><font color="#ffffff">#0088A8</font></td>
            <td width="95" bgcolor="#007799" height="30"><font color="#ffffff">#007799</font></td>
        </tr>
        <tr>
            <td width="95" bgcolor="#ccddff" height="30"><font size="+0">#CCDDFF</font></td>
            <td width="95" bgcolor="#99bbff" height="30"><font size="+0">#99BBFF</font></td>
            <td width="95" bgcolor="#5599ff" height="30"><font size="+0">#5599FF</font></td>
            <td width="95" bgcolor="#0066ff" height="30"><font color="#ffffff">#0066FF </font></td>
            <td width="95" bgcolor="#0044bb" height="30"><font color="#ffffff">#0044BB </font></td>
            <td width="95" bgcolor="#003c9d" height="30"><font color="#ffffff">#003C9D </font></td>
            <td width="95" bgcolor="#003377" height="30"><font color="#ffffff">#003377 </font></td>
        </tr>
        <tr>
            <td width="95" bgcolor="#ccccff" height="30"><font size="+0">#CCCCFF</font></td>
            <td width="95" bgcolor="#9999ff" height="30"><font size="+0">#9999FF</font></td>
            <td width="95" bgcolor="#5555ff" height="30"><font color="#ffffff">#5555FF </font></td>
            <td width="95" bgcolor="#0000ff" height="30"><font color="#ffffff">#0000FF </font></td>
            <td width="95" bgcolor="#0000cc" height="30"><font color="#ffffff">#0000CC </font></td>
            <td width="95" bgcolor="#0000aa" height="30"><font color="#ffffff">#0000AA </font></td>
            <td width="95" bgcolor="#000088" height="30"><font color="#ffffff">#000088 </font></td>
        </tr>
        <tr>
            <td width="95" bgcolor="#ccbbff" height="30"><font size="+0">#CCBBFF</font></td>
            <td width="95" bgcolor="#9f88ff" height="30"><font size="+0">#9F88FF</font></td>
            <td width="95" bgcolor="#7744ff" height="30"><font color="#ffffff">#7744FF </font></td>
            <td width="95" bgcolor="#5500ff" height="30"><font color="#ffffff">#5500FF </font></td>
            <td width="95" bgcolor="#4400cc" height="30"><font color="#ffffff">#4400CC </font></td>
            <td width="95" bgcolor="#2200aa" height="30"><font color="#ffffff">#2200AA </font></td>
            <td width="95" bgcolor="#220088" height="30"><font color="#ffffff">#220088 </font></td>
        </tr>
        <tr>
            <td width="95" bgcolor="#d1bbff" height="30"><font size="+0">#D1BBFF</font></td>
            <td width="95" bgcolor="#b088ff" height="30"><font size="+0">#B088FF</font></td>
            <td width="95" bgcolor="#9955ff" height="30"><font color="#ffffff">#9955FF </font></td>
            <td width="95" bgcolor="#7700ff" height="30"><font color="#ffffff">#7700FF </font></td>
            <td width="95" bgcolor="#5500dd" height="30"><font color="#ffffff">#5500DD </font></td>
            <td width="95" bgcolor="#4400b3" height="30"><font color="#ffffff">#4400B3 </font></td>
            <td width="95" bgcolor="#3a0088" height="30"><font color="#ffffff">#3A0088 </font></td>
        </tr>
        <tr>
            <td width="95" bgcolor="#e8ccff" height="30"><font size="+0">#E8CCFF</font></td>
            <td width="95" bgcolor="#d28eff" height="30"><font size="+0">#D28EFF</font></td>
            <td width="95" bgcolor="#b94fff" height="30"><font color="#ffffff">#B94FFF </font></td>
            <td width="95" bgcolor="#9900ff" height="30"><font color="#ffffff">#9900FF </font></td>
            <td width="95" bgcolor="#7700bb" height="30"><font color="#ffffff">#7700BB </font></td>
            <td width="95" bgcolor="#66009d" height="30"><font color="#ffffff">#66009D </font></td>
            <td width="95" bgcolor="#550088" height="30"><font color="#ffffff">#550088 </font></td>
        </tr>
        <tr>
            <td width="95" bgcolor="#f0bbff" height="30"><font size="+0">#F0BBFF</font></td>
            <td width="95" bgcolor="#e377ff" height="30"><font size="+0">#E38EFF</font></td>
            <td width="95" bgcolor="#d93eff" height="30"><font color="#ffffff">#E93EFF </font></td>
            <td width="95" bgcolor="#cc00ff" height="30"><font color="#ffffff">#CC00FF </font></td>
            <td width="95" bgcolor="#a500cc" height="30"><font color="#ffffff">#A500CC </font></td>
            <td width="95" bgcolor="#7a0099" height="30"><font color="#ffffff">#7A0099 </font></td>
            <td width="95" bgcolor="#660077" height="30"><font color="#ffffff">#660077 </font></td>
        </tr>
        <tr>
            <td width="95" bgcolor="#ffb3ff" height="30"><font size="+0">#FFB3FF</font></td>
            <td width="95" bgcolor="#ff77ff" height="30"><font size="+0">#FF77FF</font></td>
            <td width="95" bgcolor="#ff3eff" height="30"><font color="#ffffff">#FF3EFF </font></td>
            <td width="95" bgcolor="#ff00ff" height="30"><font color="#ffffff">#FF0 0FF </font></td>
            <td width="95" bgcolor="#cc00cc" height="30"><font color="#ffffff">#CC00CC </font></td>
            <td width="95" bgcolor="#990099" height="30"><font color="#ffffff">#990099 </font></td>
            <td width="95" bgcolor="#770077" height="30"><font color="#ffffff">#770077 </font></td>
        </tr>
    </tbody>
</table>
</p>
<p class="cnt" align="center">
<table border="0">
    <tbody>
        <tr>
            <th width="130">顏色名稱</th>
            <th width="80">代碼</th>
            <th width="80">
            <p align="center">顏色</p>
            </th>
        </tr>
        <tr>
            <td><u><font color="#0000ff">maroon </font></u></td>
            <td>#800000</td>
            <td bgcolor="#800000">　</td>
        </tr>
        <tr>
            <td>darkred</td>
            <td>#8B0000</td>
            <td bgcolor="#8b0000">　</td>
        </tr>
        <tr>
            <td>brown</td>
            <td>#A52A2A</td>
            <td bgcolor="#a52a2a">　</td>
        </tr>
        <tr>
            <td><u><font color="#0000ff">firebrick </font></u></td>
            <td>#B22222</td>
            <td bgcolor="#b22222">　</td>
        </tr>
        <tr>
            <td>crimson</td>
            <td>#DC143C</td>
            <td bgcolor="#dc143c">　</td>
        </tr>
        <tr>
            <td>red</td>
            <td>#FF0000</td>
            <td bgcolor="#ff0000">　</td>
        </tr>
    </tbody>
</table>
</p>
<p class="cnt" align="center"><u><font color="#0000ff">桃紅~紛紅</font></u></p>
<p class="cnt" align="center">
<table>
    <tbody>
        <tr>
            <th width="130">顏色名稱</th>
            <th width="80">代碼</th>
            <th width="80">
            <p align="center">顏色</p>
            </th>
        </tr>
        <tr>
            <td>mediumvioletred</td>
            <td>#C71585</td>
            <td bgcolor="#c71585">　</td>
        </tr>
        <tr>
            <td>palevioletred</td>
            <td>#D87093</td>
            <td bgcolor="#d87093">　</td>
        </tr>
        <tr>
            <td><u><font color="#0000ff">deeppink </font></u></td>
            <td>#FF1493</td>
            <td bgcolor="#ff1493">　</td>
        </tr>
        <tr>
            <td>fuchsia(magenta)</td>
            <td>#FF00FF</td>
            <td bgcolor="#ff00ff">　</td>
        </tr>
        <tr>
            <td>hotpink</td>
            <td>#FF69B4</td>
            <td bgcolor="#ff69b4">　</td>
        </tr>
        <tr>
            <td>pink</td>
            <td><u><font color="#0000ff">#FFC0CB</font></u></td>
            <td bgcolor="#ffc0cb">　</td>
        </tr>
        <tr>
            <td><u><font color="#0000ff">lightpink </font></u></td>
            <td>#FFB6C1</td>
            <td bgcolor="#ffb6c1">　</td>
        </tr>
        <tr>
            <td>mistyrose</td>
            <td>#FFE4E1</td>
            <td bgcolor="#ffe4e1">　</td>
        </tr>
        <tr>
            <td>lavenderblush</td>
            <td>#FFF0F5</td>
            <td bgcolor="#fff0f5">　</td>
        </tr>
    </tbody>
</table>
</p>
<p class="cnt" align="center"><u><font color="#0000ff">紫<br />
</font></u></p>
<p class="cnt" align="center">
<table>
    <tbody>
        <tr>
            <th width="130">顏色名稱</th>
            <th width="80">代碼</th>
            <th width="80">
            <p align="center">顏色</p>
            </th>
        </tr>
        <tr>
            <td>indigo</td>
            <td>#4B0082</td>
            <td bgcolor="#4b0082">　</td>
        </tr>
        <tr>
            <td>purple</td>
            <td>#800080</td>
            <td bgcolor="#800080">　</td>
        </tr>
        <tr>
            <td>darkmagenta</td>
            <td><u><font color="#0000ff">#8B008B</font></u></td>
            <td bgcolor="#8b008b">　</td>
        </tr>
        <tr>
            <td><u><font color="#0000ff">darkorchid</font></u></td>
            <td>#9932CC</td>
            <td bgcolor="#9932cc">　</td>
        </tr>
        <tr>
            <td>blueviolet</td>
            <td>#8A2BE2</td>
            <td bgcolor="#8a2be2">　</td>
        </tr>
        <tr>
            <td>darkviolet</td>
            <td>#9400D3</td>
            <td bgcolor="#9400d3">　</td>
        </tr>
        <tr>
            <td>slateblue</td>
            <td>#6A5ACD</td>
            <td bgcolor="#6a5acd">　</td>
        </tr>
        <tr>
            <td>mediumpurple</td>
            <td>#9370DB</td>
            <td bgcolor="#9370db">　</td>
        </tr>
        <tr>
            <td>mediumslateblue</td>
            <td><u><font color="#0000ff">#7B68EE</font></u></td>
            <td bgcolor="#7b68ee">　</td>
        </tr>
        <tr>
            <td>mediumorchid</td>
            <td>#BA55D3</td>
            <td bgcolor="#ba55d3">　</td>
        </tr>
        <tr>
            <td><u><font color="#0000ff">violet </font></u></td>
            <td>#EE82EE</td>
            <td bgcolor="#ee82ee">　</td>
        </tr>
        <tr>
            <td>plum</td>
            <td>#DDA0DD</td>
            <td bgcolor="#dda0dd">　</td>
        </tr>
        <tr>
            <td>thistle</td>
            <td><u><font color="#0000ff">#D8BFD8</font></u></td>
            <td bgcolor="#d8bfd8">　</td>
        </tr>
        <tr>
            <td>lavender</td>
            <td>#E6E6FA</td>
            <td bgcolor="#e6e6fa">　</td>
        </tr>
    </tbody>
</table>
</p>
<p class="cnt" align="center"><u><font color="#0000ff">褐~橘~米白<br />
</font></u></p>
<p class="cnt" align="center">
<table>
    <tbody>
        <tr>
            <th width="130">顏色名稱</th>
            <th width="80">代碼</th>
            <th width="80">
            <p align="center">顏色</p>
            </th>
        </tr>
        <tr>
            <td>saddlebrown</td>
            <td>#8B4513</td>
            <td bgcolor="#8b4513">　</td>
        </tr>
        <tr>
            <td>s<a href="http://www.pcjqw.com/">IE</a>nna</td>
            <td><u><font color="#0000ff">#A0522D</font></u></td>
            <td bgcolor="#a0522d">　</td>
        </tr>
        <tr>
            <td>chocolate</td>
            <td>#D2691E</td>
            <td bgcolor="#d2691e">　</td>
        </tr>
        <tr>
            <td>indianred</td>
            <td>#CD5C5C</td>
            <td bgcolor="#cd5c5c">　</td>
        </tr>
        <tr>
            <td>rosybrown</td>
            <td>#BC8F8F</td>
            <td bgcolor="#bc8f8f">　</td>
        </tr>
        <tr>
            <td><u><font color="#0000ff">lightcorol </font></u></td>
            <td><u><font color="#0000ff">#F08080</font></u></td>
            <td bgcolor="#f08080">　</td>
        </tr>
        <tr>
            <td>salmon</td>
            <td>#FA8072</td>
            <td bgcolor="#fa8072">　</td>
        </tr>
        <tr>
            <td>lightsalmon</td>
            <td>#FFA07A</td>
            <td bgcolor="#ffa07a">　</td>
        </tr>
        <tr>
            <td>orangered</td>
            <td>#FF4500</td>
            <td bgcolor="#ff4500">　</td>
        </tr>
        <tr>
            <td>tomato</td>
            <td><u><font color="#0000ff">#FF6347 </font></u></td>
            <td bgcolor="#ff6347">　</td>
        </tr>
        <tr>
            <td>coral</td>
            <td>#FF7F50</td>
            <td bgcolor="#ff7f50">　</td>
        </tr>
        <tr>
            <td>darkorange</td>
            <td>#FF8C00</td>
            <td bgcolor="#ff8c00">　</td>
        </tr>
        <tr>
            <td>sandybrown</td>
            <td>#F4A460</td>
            <td bgcolor="#f4a460">　</td>
        </tr>
        <tr>
            <td>peru</td>
            <td>#CD853F</td>
            <td bgcolor="#cd853f">　</td>
        </tr>
        <tr>
            <td>tan</td>
            <td>#D2B48C</td>
            <td bgcolor="#d2b48c">　</td>
        </tr>
        <tr>
            <td>burlywood</td>
            <td>#DEB887</td>
            <td bgcolor="#deb887">　</td>
        </tr>
        <tr>
            <td>wheat</td>
            <td><u><font color="#0000ff">#F5DEB3</font></u></td>
            <td bgcolor="#f5deb3">　</td>
        </tr>
        <tr>
            <td>moccasin</td>
            <td>#FFE4B5</td>
            <td bgcolor="#ffe4b5">　</td>
        </tr>
        <tr>
            <td>navajowhite</td>
            <td>#FFDEAD</td>
            <td bgcolor="#ffdead">　</td>
        </tr>
        <tr>
            <td>peachpuff</td>
            <td>#FFDAB9</td>
            <td bgcolor="#ffdab9">　</td>
        </tr>
        <tr>
            <td><u><font color="#0000ff">bisque </font></u></td>
            <td>#FFE4C4</td>
            <td bgcolor="#ffe4c4">　</td>
        </tr>
        <tr>
            <td>antuquewhite</td>
            <td>#FAEBD7</td>
            <td bgcolor="#faebd7">　</td>
        </tr>
        <tr>
            <td>papayawhip</td>
            <td>#FFEFD5</td>
            <td bgcolor="#ffefd5">　</td>
        </tr>
        <tr>
            <td>cornsilk</td>
            <td><u><font color="#0000ff">#FFF8DC</font></u></td>
            <td bgcolor="#fff8dc">　</td>
        </tr>
        <tr>
            <td>oldlace</td>
            <td>#FDF5E6</td>
            <td bgcolor="#fdf5e6">　</td>
        </tr>
        <tr>
            <td>linen</td>
            <td>#FAF0E6</td>
            <td bgcolor="#faf0e6">　</td>
        </tr>
        <tr>
            <td>seashell</td>
            <td>#FFF5EE</td>
            <td bgcolor="#fff5ee">　</td>
        </tr>
        <tr>
            <td><u><font color="#0000ff">snow </font></u></td>
            <td>#FFFAFA</td>
            <td bgcolor="#fffafa">　</td>
        </tr>
        <tr>
            <td>floralwhite</td>
            <td>#FFFAF0</td>
            <td bgcolor="#fffaf0">　</td>
        </tr>
        <tr>
            <td>ivory</td>
            <td><u><font color="#0000ff">#FFFFF0 </font></u></td>
            <td bgcolor="#fffff0">　</td>
        </tr>
        <tr>
            <td>mintcream</td>
            <td>#F5FFFA</td>
            <td bgcolor="#f5fffa">　</td>
        </tr>
    </tbody>
</table>
</p>
<p class="cnt" align="center"><u><font color="#0000ff">金~黃<br />
</font></u></p>
<p class="cnt" align="center">
<table>
    <tbody>
        <tr>
            <th width="130">顏色名稱</th>
            <th width="80">代碼</th>
            <th width="80">
            <p align="center">顏色</p>
            </th>
        </tr>
        <tr>
            <td>darkgoldenrod</td>
            <td>#B8860B</td>
            <td bgcolor="#b8860b">　</td>
        </tr>
        <tr>
            <td>goldenrod</td>
            <td>#DAA520</td>
            <td bgcolor="#daa520">　</td>
        </tr>
        <tr>
            <td><u><font color="#0000ff">gold </font></u></td>
            <td>#FFD700</td>
            <td bgcolor="#ffd700">　</td>
        </tr>
        <tr>
            <td>yellow</td>
            <td>#FFFF00</td>
            <td bgcolor="#ffff00">　</td>
        </tr>
        <tr>
            <td>darkkhaki</td>
            <td>#BDB76B</td>
            <td bgcolor="#bdb76b">　</td>
        </tr>
        <tr>
            <td>khaki</td>
            <td>#F0E68C</td>
            <td bgcolor="#f0e68c">　</td>
        </tr>
        <tr>
            <td>palegoldenrod</td>
            <td><u><font color="#0000ff">#EEE8AA</font></u></td>
            <td bgcolor="#eee8aa">　</td>
        </tr>
        <tr>
            <td>beige</td>
            <td>#F5F5DC</td>
            <td bgcolor="#f5f5dc">　</td>
        </tr>
        <tr>
            <td>lemonchiffon</td>
            <td>#FFFACD</td>
            <td bgcolor="#fffacd">　</td>
        </tr>
        <tr>
            <td>lightgoldenrodyellow</td>
            <td>#FAFAD2</td>
            <td bgcolor="#fafad2">　</td>
        </tr>
        <tr>
            <td><u><font color="#0000ff">lightyellow</font></u></td>
            <td>#FFFFE0</td>
            <td bgcolor="#ffffe0">　</td>
        </tr>
    </tbody>
</table>
</p>
<p class="cnt" align="center"><u><font color="#0000ff">~黃<br />
</font></u></p>
<p class="cnt" align="center"><u><font color="#0000ff">綠</font></u></p>
<p class="cnt" align="center">
<table>
    <tbody>
        <tr>
            <th width="130">顏色名稱</th>
            <th width="80">代碼</th>
            <th width="80">
            <p align="center">顏色</p>
            </th>
        </tr>
        <tr>
            <td>darkslategray</td>
            <td>#2F4F4F</td>
            <td bgcolor="#2f4f4f">　</td>
        </tr>
        <tr>
            <td>darkolivegreen</td>
            <td>#556B2F</td>
            <td bgcolor="#556b2f">　</td>
        </tr>
        <tr>
            <td><u><font color="#0000ff">olive </font></u></td>
            <td>#808000</td>
            <td bgcolor="#808000">　</td>
        </tr>
        <tr>
            <td>darkgreen</td>
            <td>#006400</td>
            <td bgcolor="#006400">　</td>
        </tr>
        <tr>
            <td>forestgreen</td>
            <td>#228B22</td>
            <td bgcolor="#228b22">　</td>
        </tr>
        <tr>
            <td>seagreen</td>
            <td><u><font color="#0000ff">#2E8B57</font></u></td>
            <td bgcolor="#2e8b57">　</td>
        </tr>
        <tr>
            <td>green(teal)</td>
            <td>#008080</td>
            <td bgcolor="#008080">　</td>
        </tr>
        <tr>
            <td>lightseagreen</td>
            <td>#20B2AA</td>
            <td bgcolor="#20b2aa">　</td>
        </tr>
        <tr>
            <td>madiumaquamarine</td>
            <td>#66CDAA</td>
            <td bgcolor="#66cdaa">　</td>
        </tr>
        <tr>
            <td>mediumseagreen</td>
            <td>#3CB371</td>
            <td bgcolor="#3cb371">　</td>
        </tr>
        <tr>
            <td>darkseagreen</td>
            <td>#8FBC8F</td>
            <td bgcolor="#8fbc8f">　</td>
        </tr>
        <tr>
            <td><u><font color="#0000ff">yellowgreen </font></u></td>
            <td>#9ACD32</td>
            <td bgcolor="#9acd32">　</td>
        </tr>
        <tr>
            <td>limegreen</td>
            <td>#32CD32</td>
            <td bgcolor="#32cd32">　</td>
        </tr>
        <tr>
            <td>lime</td>
            <td>#00FF00</td>
            <td bgcolor="#00ff00">　</td>
        </tr>
        <tr>
            <td>chartreuse</td>
            <td>#7FFF00</td>
            <td bgcolor="#7fff00">　</td>
        </tr>
        <tr>
            <td>lawngreen</td>
            <td>#7CFC00</td>
            <td bgcolor="#7cfc00">　</td>
        </tr>
        <tr>
            <td>greenyellow</td>
            <td><u><font color="#0000ff">#ADFF2F</font></u></td>
            <td bgcolor="#adff2f">　</td>
        </tr>
        <tr>
            <td>mediumspringgreen</td>
            <td>#00FA9A</td>
            <td bgcolor="#00fa9a">　</td>
        </tr>
        <tr>
            <td>springgreen</td>
            <td>#00FF7F</td>
            <td bgcolor="#00ff7f">　</td>
        </tr>
        <tr>
            <td><u><font color="#0000ff">lightgreen</font></u></td>
            <td>#90EE90</td>
            <td bgcolor="#90ee90">　</td>
        </tr>
        <tr>
            <td>palegreen</td>
            <td>#98F898</td>
            <td bgcolor="#98f898">　</td>
        </tr>
        <tr>
            <td>aquamarine</td>
            <td>#7FFFD4</td>
            <td bgcolor="#7fffd4">　</td>
        </tr>
        <tr>
            <td>honeydew</td>
            <td>#F0FFF0</td>
            <td bgcolor="#f0fff0">　</td>
        </tr>
    </tbody>
</table>
</p>
<p class="cnt" align="center"><u><font color="#0000ff">藍</font></u></p>
<p class="cnt" align="center">
<table>
    <tbody>
        <tr>
            <th width="130">顏色名稱</th>
            <th width="80">代碼</th>
            <th width="80">
            <p align="center">顏色</p>
            </th>
        </tr>
        <tr>
            <td>midnightblue</td>
            <td>#191970</td>
            <td bgcolor="#191970">　</td>
        </tr>
        <tr>
            <td>navy</td>
            <td>#000080</td>
            <td bgcolor="#000080">　</td>
        </tr>
        <tr>
            <td>darkblue</td>
            <td><u><font color="#0000ff">#00008B</font></u></td>
            <td bgcolor="#00008b">　</td>
        </tr>
        <tr>
            <td>darkslateblue</td>
            <td>#483D8B</td>
            <td bgcolor="#483d8b">　</td>
        </tr>
        <tr>
            <td>mediumblue</td>
            <td>#0000CD</td>
            <td bgcolor="#0000cd">　</td>
        </tr>
        <tr>
            <td>royalblue</td>
            <td>#4169E1</td>
            <td bgcolor="#4169e1">　</td>
        </tr>
        <tr>
            <td>dodgerblue</td>
            <td>#1E90FF</td>
            <td bgcolor="#1e90ff">　</td>
        </tr>
        <tr>
            <td><u><font color="#0000ff">cornflowerblue </font></u></td>
            <td>#6495ED</td>
            <td bgcolor="#6495ed">　</td>
        </tr>
        <tr>
            <td>deepskyblue</td>
            <td>#00BFFF</td>
            <td bgcolor="#00bfff">　</td>
        </tr>
        <tr>
            <td>lightskyblue</td>
            <td>#87CEFA</td>
            <td bgcolor="#87cefa">　</td>
        </tr>
        <tr>
            <td>lightsteelblue</td>
            <td>#B0C4DE</td>
            <td bgcolor="#b0c4de">　</td>
        </tr>
        <tr>
            <td>lightblue</td>
            <td>#ADD8E6</td>
            <td bgcolor="#add8e6">　</td>
        </tr>
        <tr>
            <td>steelblue</td>
            <td><u><font color="#0000ff">#4682B4</font></u></td>
            <td bgcolor="#4682b4">　</td>
        </tr>
        <tr>
            <td>darkcyan</td>
            <td>#008B8B</td>
            <td bgcolor="#008b8b">　</td>
        </tr>
        <tr>
            <td>cadetblue</td>
            <td>#5F9EA0</td>
            <td bgcolor="#5f9ea0">　</td>
        </tr>
        <tr>
            <td>darkturquoise</td>
            <td>#00CED1</td>
            <td bgcolor="#00ced1">　</td>
        </tr>
        <tr>
            <td>mediumturquoise</td>
            <td>#48D1CC</td>
            <td bgcolor="#48d1cc">　</td>
        </tr>
        <tr>
            <td><u><font color="#0000ff">turquoise </font></u></td>
            <td>#40E0D0</td>
            <td bgcolor="#40e0d0">　</td>
        </tr>
        <tr>
            <td>skyblue</td>
            <td>#87CECB</td>
            <td bgcolor="#87cecb">　</td>
        </tr>
        <tr>
            <td>powderblue</td>
            <td>#B0E0E6</td>
            <td bgcolor="#b0e0e6">　</td>
        </tr>
        <tr>
            <td>paleturquoise</td>
            <td>#AFEEEE</td>
            <td bgcolor="#afeeee">　</td>
        </tr>
        <tr>
            <td>lightcyan</td>
            <td><u><font color="#0000ff">#E0FFFF</font></u></td>
            <td bgcolor="#e0ffff">　</td>
        </tr>
        <tr>
            <td>azure</td>
            <td>#F0FFFF</td>
            <td bgcolor="#f0ffff">　</td>
        </tr>
        <tr>
            <td>aliceblue</td>
            <td>#F0F8FF</td>
            <td bgcolor="#f0f8ff">　</td>
        </tr>
        <tr>
            <td>aqua(cyan)</td>
            <td>#00FFFF</td>
            <td bgcolor="#00ffff">　</td>
        </tr>
    </tbody>
</table>
</p>
<p class="cnt" align="center"><u><font color="#0000ff">黑~灰~白</font></u></p>
<div class="cnt" align="center">
<table>
    <tbody>
        <tr>
            <th width="130">
            <p align="center">顏色名稱</p>
            </th>
            <div align="center"></div>
            <th width="80">代碼</th>
            <div></div>
            <div align="center"></div>
            <th width="80">
            <p align="center">顏色</p>
            </th>
            <div></div>
        </tr>
        <tr>
            <td>
            <p align="center">black</p>
            </td>
            <td>
            <p align="center">#000000</p>
            </td>
            <td bgcolor="#000000">
            <p align="center">　</p>
            </td>
        </tr>
        <tr>
            <td>
            <p align="center">dimgray</p>
            </td>
            <td>
            <p align="center">#696969</p>
            </td>
            <td bgcolor="#696969">
            <p align="center">　</p>
            </td>
        </tr>
        <tr>
            <td>
            <p align="center"><u><font color="#0000ff">gray </font></u></p>
            </td>
            <td>
            <p align="center">#808080</p>
            </td>
            <td bgcolor="#808080">
            <p align="center">　</p>
            </td>
        </tr>
        <tr>
            <td>
            <p align="center">slategray</p>
            </td>
            <td>
            <p align="center">#708090</p>
            </td>
            <td bgcolor="#708090">
            <p align="center">　</p>
            </td>
        </tr>
        <tr>
            <td>
            <p align="center">lightslategray</p>
            </td>
            <td>
            <p align="center">#778899</p>
            </td>
            <td bgcolor="#778899">
            <p align="center">　</p>
            </td>
        </tr>
        <tr>
            <td>
            <p align="center">darkgray</p>
            </td>
            <td>
            <p align="center">#A9A9A9</p>
            </td>
            <td bgcolor="#a9a9a9">
            <p align="center">　</p>
            </td>
        </tr>
        <tr>
            <td>
            <p align="center">silver</p>
            </td>
            <td>
            <p align="center"><u><font color="#0000ff">#C0C0C0</font></u></p>
            </td>
            <td bgcolor="#c0c0c0">
            <p align="center">　</p>
            </td>
        </tr>
        <tr>
            <td>
            <p align="center">lightgray</p>
            </td>
            <td>
            <p align="center">#D3D3D3</p>
            </td>
            <td bgcolor="#d3d3d3">
            <p align="center">　</p>
            </td>
        </tr>
        <tr>
            <td>
            <p align="center">gainsboro</p>
            </td>
            <td>
            <p align="center">#DCDCDC</p>
            </td>
            <td bgcolor="#dcdcdc">
            <p align="center">　</p>
            </td>
        </tr>
        <tr>
            <td>
            <p align="center"><u><font color="#0000ff">whitesmoke </font></u></p>
            </td>
            <td>
            <p align="center">#F5F5F5</p>
            </td>
            <td bgcolor="#f5f5f5">
            <p align="center">　</p>
            </td>
        </tr>
        <tr>
            <td>
            <p align="center">ghostwhite</p>
            </td>
            <td>
            <p align="center">#F8F8FF</p>
            </td>
            <td bgcolor="#f8f8ff">
            <p align="center">　</p>
            </td>
        </tr>
        <tr>
            <td>
            <p align="center">white</p>
            </td>
            <td>
            <p align="center">#FFFFFF</p>
            </td>
        </tr>
    </tbody>
</table>
</div>
<img src ="http://www.blogjava.net/xiaoyi/aggbug/228878.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.blogjava.net/xiaoyi/" target="_blank">可爱的小毅</a> 2008-09-14 13:58 <a href="http://www.blogjava.net/xiaoyi/articles/228878.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item><item><title>颜色英文代码全集</title><link>http://www.blogjava.net/xiaoyi/articles/227389.html</link><dc:creator>可爱的小毅</dc:creator><author>可爱的小毅</author><pubDate>Sat, 06 Sep 2008 04:38:00 GMT</pubDate><guid>http://www.blogjava.net/xiaoyi/articles/227389.html</guid><wfw:comment>http://www.blogjava.net/xiaoyi/comments/227389.html</wfw:comment><comments>http://www.blogjava.net/xiaoyi/articles/227389.html#Feedback</comments><slash:comments>0</slash:comments><wfw:commentRss>http://www.blogjava.net/xiaoyi/comments/commentRss/227389.html</wfw:commentRss><trackback:ping>http://www.blogjava.net/xiaoyi/services/trackbacks/227389.html</trackback:ping><description><![CDATA[&nbsp;&nbsp;&nbsp;&nbsp; 摘要: 颜色英文代码全集                                    red                                    green                                    blue                                    magent...&nbsp;&nbsp;<a href='http://www.blogjava.net/xiaoyi/articles/227389.html'>阅读全文</a><img src ="http://www.blogjava.net/xiaoyi/aggbug/227389.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.blogjava.net/xiaoyi/" target="_blank">可爱的小毅</a> 2008-09-06 12:38 <a href="http://www.blogjava.net/xiaoyi/articles/227389.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item></channel></rss>