必须将 <script> 和 <style> 元素的内容包装到 CDATA 节中。
如果在脚本或样式表中使用特殊字符（例如 < 或 &）或实体引用（例如 < 或 &），则需要将脚本或样式表的内容标记为 CDATA（字符数据）节，如下所示。
<![CDATA[
function isLess(a, b) {
if (a < b)
return true;
}
]]>
</script>
使用 CDATA 节并非对所有浏览器都有效。例如，Internet Explorer 会将 <script> 标记中的 CDATA 节视为语法错误。可以通过添加 JavaScript 注释避免该问题，如下所示。
/* <![CDATA[ */
function isLess(a, b) {
if (a < b)
return true;
}
/* ]]> */
</script>
JavaScript 使用 /* 和 */ 来标志注释的开始和结束。因此，CDATA 只对 JavaScript 隐藏，但不对分析该页的浏览器隐藏。总之，较好的做法是将样式规则和脚本放在外部文件中，而从 XHTML 页中引用这些文件。通过使用外部样式表和脚本，能够避免上述所有问题。
首先，我们对CSS作一个简单的说明：CSS是层叠样式表（Cascading Style Sheets）的简称。它的规范代表了互联网历史上一个独特的发展阶段。现在对于从事网页制作的朋友来说，应该很少没有听说过CSS了，因为在制作网页过程中我们经常需要用到。
其次：我们能通过CSS为文档设置丰富且易于修改的外观，以减轻网页制作者的工作负担，从而减轻制作及后期维护的代价。
其实现在还来讲CSS是什么，CSS有什么作用完全是多余的，相信从事网页制作的朋友都已经或多或少的接触过了。
言归正传，我们开始进入今天的话题：
一、什么是CSS优先级？
所谓CSS优先级，即是指CSS样式在浏览器中被解析的先后顺序。
二、CSS优先级规则
既然样式有优先级，那么就会有一个规则来约定这个优先级，而这个“规则”就是本次所需要讲的重点。
样式表中的特殊性描述了不同规则的相对权重，它的基本规则是：
1. 统计选择符中的ID属性个数。
2. 统计选择符中的CLASS属性个数。
3. 统计选择符中的HTML标记名个数。
最后，按正确的顺序写出三个数字，不要加空格或逗号，得到一个三位数(css2.1是用4位数表示)。( 注意，你需要把数字转换成一个以三个数字结尾的更大的数)。相应于选择符的最终数字列表可以很容易确定较高数字特性凌驾于较低数字的。
例如：
1. 每个ID选择符(#someid)，加 0,1,0,0。
2. 每个class选择符(.someclass)、每个属性选择符(形如[attr=value]等)、每个伪类(形如:hover等)加0,0,1,0。
3. 每个元素或伪元素(:firstchild)等，加0,0,0,1。
4. 其它选择符包括全局选择符*，加0,0,0,0。相当于没加，不过这也是一种specificity，后面会解释。
三、特性分类的选择符列表
以下是一个按特性分类的选择符的列表：
|
选择符 |
特性值 |
|
h1 {color:blue;} |
1 |
|
p em {color:purple;} |
2 |
|
.apple {color:red;} |
10 |
|
p.bright {color:yellow;} |
11 |
|
p.bright em.dark {color:brown;} |
22 |
|
#id316 {color:yellow} |
100 |
单从上面这个表来看，貌似不大好理解，下面再给出一张表：
|
选择符 |
特性值 |
| h1 {color:blue;} | 1 |
| p em {color:purple;} | 1+1=2 |
| .apple {color:red;} | 10 |
| p.bright {color:yellow;} | 1+10=11 |
| p.bright em.dark {color:brown;} | 1+10+1+10=22 |
| #id316 {color:yellow} | 100 |
通过上面，就可以很简单的看出，HTML标记的权重是1,CLASS的权重是10,ID的权重是100，继承的权重为0（后面会讲到）。
按这些规则将数字符串逐位相加，就得到最终的权重，然后在比较取舍时按照从左到右的顺序逐位比较。
优先级问题其实就是一个冲突解决的问题，当同一个元素（内容）被CSS选择符选中时，就要按照优先级取舍不同的CSS规则，这其中涉及到的问题其实很多。
说到这里，我们不得不说一下CSS的继承性。
四、CSS的继承性
4.1 继承的表现
继承是CSS的一个主要特征，它是依赖于祖先-后代的关系的。继承是一种机制，它允许样式不仅可以应用于某个特定的元素，还可以应用于它的后代。例如一个BODY定义了的颜色值也会应用到段落的文本中。
样式定义：body {color:#f00;}
举例代码：<p>CSS<strong>继承性</strong>的测试</p>
举例效果： 
这段代码的应用结果是：“CSS继承性的测试”这段话是红颜色的，“继承性”几个字由于应用了<strong>标签，所以是粗体。很显然，这段文字都继承了由body {color:#f00;}样式定义的颜色。这也就是为什么说继承性是CSS的一部分。
然而CSS继承性的权重是非常低的，是比普通元素的权重还要低的0。
我们仍以上面的举例代码为例：在样式定义中添加一条：strong {color:#000;}。
举例效果： 
发现只需要给<strong>加个颜色值就能覆盖掉它继承自<body>的样式颜色。由此可见：任何显示申明的规则都可以覆盖其继承样式。
4.2 继承的局限性
继承是CSS重要的一部分，我们甚至不用去考虑它为什么能够这样，但CSS继承也是有限制的。
有一些属性不能被继承，如：border, margin, padding, background等。
样式定义：div {border:1px solid #000;}
举例代码：<div>我是<em>border</em>我是不能被继承滴</div>
预期效果： 
实际效果： 
从上面的效果中，我们可以看出，border是不能被继承的，还有一些其它的属性也是如此，这里就不一一列举。
五、附加说明
1. 文内的样式优先级为1,0,0,0，所以始终高于外部定义。这里文内样式指形如<div style="color:red">blah</div>的样式，而外部定义指经由<link>或<style>卷标定义的规则。
2. 有!important声明的规则高于一切。
3. 如果!important声明冲突，则比较优先权。
4. 如果优先权一样，则按照在源码中出现的顺序决定，后来者居上。
5. 由继承而得到的样式没有specificity的计算，它低于一切其它规则(比如全局选择符*定义的规则)。
6. 关于经由@import加载的外部样式，由于@import必须出现在所有其它规则定义之前(如不是，则浏览器应该忽略之)，所以按照后来居上原则，一般优先权冲突时是占下风的。
还需要说一下，IE是可以识别位置错误的@import的，但无论@import在什么地方，它都认为是位于所有其它规则定义之前的，这可能会引发一些误会。
优先权问题看起来简单，但背后还是有非常复杂的机制，在实际应用中需要多多留意。
六、练习
看完上面的文字后，来做几道非常简单的题目。（自己答完前，请不要先看各题给出的链接地址哦）
1. 如何让使用两个使用相同样式名的元素具有不同的效果：css优先级测试
固定效果： 
固定代码： <div class="test">传说中的测试</div>
<p class="test">传说中的测试</p>
2. 如何让<h3>始终为黑色，而<em>在不被<h3>包含的情况为红色：css优先级测试
固定效果： 
固定代码： <h3>讨论<em>CSS</em>优先级</h3>
<p>讨论<em>CSS</em>优先级</p>
3. 如何写一个外部样式使得<h3 style="color:#000;"> 覆盖我</h3>的颜色为红色：css优先级测试
4. 如何让同时具有.a,.b样式的元素只表现.a的颜色样式：css优先级测试
固定代码：<p class="a b">传说中滴测试</p>
关于样式优先级，今天就先聊到这
.myct{
height: 100px;
border-right: 1px solid #99CCFF;
border-bottom: 1px solid #99CCFF;
border-left: 1px solid #99CCFF;
width: 593px;
padding-top: 5px;
padding-left: 5px;
}
.lib_Menubox {
height:28px;
line-height:28px;
border-bottom: 1px solid #95C9E1;
width: 600px;
}
.lib_Menubox ul {
margin: 0px;
padding: 0px;
list-style: none;
height: 25px;
position: relative;
top: 2px;
}
.lib_Menubox li {
float:left;
display:block;
cursor:pointer;
margin-right:8px;
line-height:25px;
width:114px;
border-top: 1px solid #99CCFF;
border-right: 1px solid #99CCFF;
border-left: 1px solid #99CCFF;
text-align: center;
font-weight:bold;
}
.normaltab {
color:#949694;
background:#E4F2FD;
}
.hovertab {
background:#FFFFFF;
color:#739242;
height:26px;
}
.dis {
display: block;
}
.undis {
display: none;
}
</style>
//<!CDATA[
function HoverLi(n){
//如果有N个标签,就将i<=N;
for(var i=1;i<=4;i++)
{//全部重写成normaltab与undis,后再设成dis与hovertab;
document.getElementById('tb_'+i).className='normaltab';
document.getElementById('tbc_0'+i).className='undis';
}
document.getElementById('tbc_0'+n).className='dis';
document.getElementById('tb_'+n).className='hovertab';
}
//如果要做成点击后再转到请将<li>中的onmouseover 改成 onclick;
//]]>
</script>
<div class="lib_Menubox">
<ul>
<li id="tb_1" class="normaltab" onclick="HoverLi(1);">源码爱好者</li>
<li id="tb_2" class="hovertab" onclick="HoverLi(2);">最新更新</li>
<li id="tb_3" class="normaltab" onclick="HoverLi(3);">下载排行</li>
<li id="tb_4" class="normaltab" onclick="HoverLi(4);">大 乐 斗</li>
</ul>
</div>
<div class="myct">
<div id="tbc_01" class="dis">这里是ASP.NET的相关内容</div>
<div id="tbc_02" class="undis" >这里是VB.NET的相关内容</div>
<div id="tbc_03" class="undis" >这里是JAVA的相关内容</div>
<div id="tbc_04" class="undis" >这里是PHP5的相关内容</div>
</div>
</div>
像素：在屏幕上显示最小单个的染色点。把一张图片放大，会发现这些连续色调其实是由许多色彩相近的小方点所组成，这些小方点就是构成图片的最小单位“像素”（Pixel）。
像素深度：是指存储每个像素所用的位数，像素深度决定彩色图像的每个像素可能有的颜色数。例如，一幅彩色图像的每个像素用R，G，B三个分量表示，若每个分量用8位，那末一个像素共用24位表示，就说像素的深度为24，每个像素可以是224=16 777 216种颜色中的一种。虽然像素深度或图像深度可以很深，但各种VGA的颜色深度却受到限制。例如，标准VGA支持4位16种颜色的彩色图像，多媒体应用中推荐至少用8位256种颜色。由于设备的限制，加上人眼分辨率的限制，一般情况下，不一定要追求特别深的像素深度。此外，像素深度越深，所占用的存储空间越大。相反，如果像素深度太浅，那也影响图像的质量，图像看起来让人觉得很粗糙和很不自然。虽然像素深度或图像深度可以很深，但各种VGA的颜色深度却受到限制。例如，标准VGA支持4位16种颜色的彩色图像，多媒体应用中推荐至少用8位256种颜色。由于设备的限制，加上人眼分辨率的限制，一般情况下，不一定要追求特别深的像素深度。此外，像素深度越深，所占用的存储空间越大。相反，如果像素深度太浅，那也影响图像的质量，图像看起来让人觉得很粗糙和很不自然。
分辨率：就是屏幕图像的精密度，是指显示器所能显示的像素的多少。由于屏幕上的点、线和面都是由像素组成的，显示器可显示的像素越多，画面就越精细，同样的屏幕区域内能显示的信息也越多，所以分辨率是个非常重要的性能指标之一。以分辨率为1024×768的屏幕来说，即每一条水平线上包含有1024个像素点，共有768条线，即扫描列数为1024列，行数为768行。分辨率不仅与显示尺寸有关，还受显像管点距、视频带宽等因素的影响。其中，它和刷新频率的关系比较密切，严格地说，只有当刷新频率为“无闪烁刷新频率”，显示器能达到最高多少分辨率，才能称这个显示器的最高分辨率为多少。
第二章 数据库设计
数据库设计目前流行的有六个步骤：需求分析、概念结构设计、逻辑结构设计、数据库物理结构设计、数据库实施、数据库运行和维护。
一、需求分析
进行数据库设计首先必须准备了解用户的需求，需求分析是整个设计过程中最基础、最困难、最耗时间的一步。需求分析的结果正确与否，将直接影响到设计结果是否合理性和实用性。
二、概念结构设计
概念结构设计也叫概念建模，概念建模是用户与数据库设计人员之间进行交流的语言，主要解决对计算机语言不了解的用户进行交流。如：ER图。
三、逻辑结构设计
逻辑结构设计是将概念结构设计转换为DBMS支持的数据模型，并对其优化符合相应的范式、完整性约束等。
四、数据库物理设计
对逻辑结构设计选取合适的物理结构（包括硬件设备、数据存取方式等）。
五、数据库实施
根据逻辑结构设计和数据库物理设计结果建立数据库，进行调试并组织数据入库，进行试运行。
六、数据库运行和维护
运行过程中必须不断地对其进行评价、调整与修改。