今天咱们要聊一聊那些我们经常遇到的，又如何给它们穿上色彩斑斓外衣的小家伙们：css的tag文字颜色和背景颜色！

想象一下，你正在看的这个页面，若是一片毫无色彩的均一，你愿意停留吗？我猜你可能会打个哈欠，然后溜走吧。但我们的救星CSS来了，它就像一个潮牌设计师，为我们的网页生活增添了无穷的乐趣。

首先，我们要来给文字上色。只需用CSS的color属性就行啦。比如，你想把一个p标签的字体变为一种颜色，就写上color:#ccc;就行。然后就是hover上去以后得背景色。

#divTags .a-tag-2:nth-child(10n+1) { color: #f44336; }
#divTags .a-tag-2:nth-child(10n+2) { color: #4caf50; }
#divTags .a-tag-2:nth-child(10n+3) { color: #0B0B0B; }
#divTags .a-tag-2:nth-child(10n+4) { color: #00bcd4; }
#divTags .a-tag-2:nth-child(10n+5) { color: #2196f3; }
#divTags .a-tag-2:nth-child(10n+6) { color: #e91e63; }
#divTags .a-tag-2:nth-child(10n+7) { color: #34495e; }
#divTags .a-tag-2:nth-child(10n+8) { color: #003366; }
#divTags .a-tag-2:nth-child(10n+9) { color: #B37333; }
#divTags .a-tag-2:nth-child(10n) { color: #CC0000; }
#divTags > a:nth-child(10n+1) > span:hover { color: #fff; background: #f44336; }
#divTags > a:nth-child(10n+2) > span:hover { color: #fff; background: #4caf50; }
#divTags > a:nth-child(10n+3) > span:hover { color: #fff; background: #0B0B0B; }
#divTags > a:nth-child(10n+4) > span:hover { color: #fff; background: #00bcd4; }
#divTags > a:nth-child(10n+5) > span:hover { color: #fff; background: #2196f3; }
#divTags > a:nth-child(10n+6) > span:hover { color: #fff; background: #e91e63; }
#divTags > a:nth-child(10n+7) > span:hover { color: #fff; background: #34495e; }
#divTags > a:nth-child(10n+8) > span:hover { color: #fff; background: #003366; }
#divTags > a:nth-child(10n+9) > span:hover { color: #fff; background: #B37333; }
#divTags > a:nth-child(10n+10) > span:hover { color: #fff; background: #CC0000; }

当然，文字颜色和背景颜色的赋值，除了可以直接写英文颜色名，我们还可以使用 RGB（如: rgb(255, 0, 0)）、HEX（如: #FF0000）等方式去指定颜色，真的超级酷炫！

这就对了，充满色彩的世界就应该是这样，经过你的精心设计，每一个元素都会有自己的个性，闪闪发光。而CSS就是实现这一切的神奇魔法，赶快行动，给你的网页来一场绚丽的色彩派对吧！