jQuery中有两个方法——ready和load。它们非常容易混淆。这里做一下区分：
jQuery中的ready特指“DOM”全部加载完毕，也就是说，只要DOM加载完毕了，这个事件自然被触发了。所谓“DOM”加载完毕指整个页面的标签部分全部加载完毕，至于说某些标签内部可能还存在着一系列事件未完成（譬如img标签可能加载远处一个很大的bmp图片尚未加载完毕等情况）则被忽略。因此对于单纯设置某些Html标签的事件或者属性的绑定而言，在ready方法中显然比load更为适合（因为load必须等到全部的标签都处于完成状态，包括img把图片全部加载完毕为止）。
这里不妨给出一个现成的示例代码（纯Html）：
<head runat="server">
<title></title>
<script src="/blog_article/Scripts/jquery-1.8.3.js"></script>
<script>
$(function () {
alert("DOM加载完毕");
});
</script>
</head>
<body onload="alert('Body加载完毕');">
<form id="form1" runat="server">
<div>
<img src="/images/desktops/a-m/Bliss.bmp" />
</div>
</form>
</body>
</html>
注意jQuery中的$(function……)就是静止等待知道整个DOM加载完毕之后触发事件。其等同于：
1）
alert("DOM加载完毕");
});
2）
alert("DOM加载完毕");
});
如果你运行这个页面（直接在IE或者其它页面中打开），你会发觉先弹出“DOM加载完毕”的消息框，然后可能直到BMP图片加载完毕之后才会弹出“Body”加载完毕的消息。这就是它们之间最大的差别。
顺便提及一句，如果这样进行比较：
<head runat="server">
<title></title>
<script src="/blog_article/Scripts/jquery-1.8.3.js"></script>
<script>
$(function () {
alert("DOM加载完毕");
});
$(window).ready(function ()
{
alert("Window加载完毕");
});
</script>
</head>
<body onload="alert('Body加载完毕');">
<form id="form1" runat="server">
<div>
<img src=/blog_article/……/>_br/index.html> </div>
</form>
</body>
</html>
运行顺序将是先弹出“DOM加载完毕”，之后才弹出“Window加载完毕”，最后弹出“Body加载完毕”。那是因为DOM的本质是document，是Window的一个属性对象。自然等到DOM加载完毕之后Window对象才表示初步构建完毕（window对象自身没有顶层对象了，其本身就是顶层对象）。而DOM初步加载完毕并不表示每一个元素都加载完毕，因此body中的
CSS 中的颜色有三种定义方式：使用颜色方法（RGB、RGBA、HSL、HSLA），十六进制颜色值和预定义的颜色名称。今天这篇文章我们一起来探讨一下 CSS3 中的 RGBA 属性。RGB 对于大家来说一点不陌生，他就是 Red（红色） Green（绿色）和 Blue（蓝色），那么现在我们所说的 RGBA 又是什么呢？
您可能感兴趣的相关文章- 20个非常绚丽的 CSS3 特性应用演示
- 23个纯 CSS3 打造的精美LOGO图案
- 35个让人惊讶的 CSS3 动画效果演示
- 推荐12个漂亮的 CSS3 按钮实现方案
- 24款非常实用的 CSS3 工具终极收藏
RGBA 是代表Red（红色） Green（绿色） Blue（蓝色）和 Alpha（不透明度）的色彩空间。虽然它有的时候被描述为一个颜色空间，但是它其实仅仅是 RGB 模型附加了额外的信息从而形成了我们今天需要讨论的 RGBA。如果需要更详细的解说，大家就跟着我一起往下看吧。
基本语法:
R：红色值。正整数 | 百分数
G：绿色值。正整数 | 百分数
B：蓝色值。正整数| 百分数
A：透明度。取值0~1之间
取值区间：
<length> ：Hue(色调)。 0(或360)表示红色，120表示绿色，240表示蓝色，当然可取其他数值来确定其它颜色；
<percentage> ：Saturation(饱和度)。 取值为0%到100%之间的值；
<percentage> ：Lightness(亮度)。 取值为0%到100%之间的值；
<opacity> ：alpha(透明度)。 取值在0到1之间；
简单说明：
RGB 色彩模式（也翻译为“红绿蓝”，比较少用）是工业界的一种颜色标准，是通过对红(R)、绿(G)、蓝(B)三个颜色通道的变化以及它们相互之间的叠加来得到各式各样的颜色的，RGB即是代表红、绿、蓝三个通道的颜色，这个标准几乎包括了人类视力所能感知的所有颜色，是目前运用最广的颜色系统之一。
RGBA 在 RGB 的基础上多了控制 Alpha 透明度的参数。以上R、G、B三个参数，正整数值的取值范围为：0 - 255。百分数值的取值范围为：0.0% - 100.0%。超出范围的数值将被截至其最接近的取值极限。并非所有浏览器都支持使用百分数值。A参数，取值在0~1之间，不可为负值。
浏览器的兼容性：
如果庞统说 RGBA 是制作透明色（透明背景色、透明边框色、透明前景色等），大家不由会想起 opacity 这个东西。他在我们 CSS2 中制作背景色通常用到，可是要用他来制作边框色或都说前景色的话，那他就只能在边上站着了，有心无力呀。
现在我们先来看一个 RGBA 和 Opacity 的对比实例，HTML 代码：
<p>Opacity效果</p>
<ul>
<li >100%</li>
<li >80%</li>
<li >60%</li>
<li >40%</li>
<li >20%</li>
<li >0</li>
</ul>
<p>CSS3的RGBA效果</p>
<ul>
<li >1</li>
<li >0.8</li>
<li >0.6</li>
<li >0.4</li>
<li >0.2</li>
<li >0</li>
</ul>
</div>
我们分别给这两上 ul 中的 li 应用相关样式， 在 li.opacity 中我用使用 CSS2 中的 Opacity 而在 li.rgba 中我们使用 CSS3 的 RGBA新属性。
Opacity样式
float: left;
width: 50px;
height: 50px;
}
li.opacity1 {
background: rgb(255,255,0);
opacity: 1;
filter:alpha(opaity=100);
}
li.opacity2 {
background: rgb(255,255,0);
opacity: 0.8;
filter:alpha(opaity=80);
}
li.opacity3 {
background: rgb(255,255,0);
opacity: 0.6;
filter:alpha(opaity=60);
}
li.opacity4 {
background: rgb(255,255,0);
opacity: 0.4;
filter:alpha(opaity=40);
}
li.opacity5 {
background: rgb(255,255,0);
opacity: 0.2;
filter:alpha(opaity=20);
}
li.opacity6 {
background: rgb(255,255,0);
opacity: 0;
filter:alpha(opaity=0);
}
RGBA样：
float: left;
width: 50px;
height: 50px;
}
li.rgba1 {
background: rgba(255,255,0,1);
}
li.rgba2 {
background: rgba(255,255,0,0.8);
}
li.rgba3 {
background: rgba(255,255,0,0.6);
}
li.rgba4 {
background: rgba(255,255,0,0.4);
}
li.rgba5 {
background: rgba(255,255,0,0.2);
}
li.rgba6 {
background: rgba(255,255,0,0);
}
我们来看看其效果：
效果中我们可以看出，他们相同之处就是背景色完全是一样的，但区别就是一直让大家觉得头痛的问题，那就是 Opacity 后代元素会随着一起具有透明性，所以我们 Opacity 中的字随着透明值下降越来越看不清楚，而 RGBA 不具有这样的问题，但是其支持的浏览器中有一个占在大市场份额的 IE 不支持，这也就是让我们需要去做兼容，（听到兼容二字大家是不是特烦，我也是的）希望 IE 早点能实现。
在 CSS2 中 Opacity 能实现透明，而且大多主流浏览器都支持，虽然 IE 下有点麻烦：
filter: alpha(opacity=80);
/* IE 8 */
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
/* Everyone else */
opacity: 0.8;
那为什么不使用 Opacity 而要使用 RGBA 呢？
从我们上面的实例中我们也知道，RGBA 比元素设置 CSS 的透明度更好，因为单独的颜色可以在不影响整个元素的透明度，他不会影响到元素其他的属性，比如说边框，字体同时也不会影响到其他元素的相关透明度。
在 RGBA 还没有出世前，我们都是使用 Opacity 来做透明，但这里存在一个问题，就是我们在父元素中使用了 Opacity，那么其垢代元素都会受其影响，我想这个问题大家都有碰到过，为了解决这样的问题我们需要增加一个空的 div 来专门放置使用透明的背景，然后通过使用绝对定位来实现我们需要的结果。为了更好的理解我们在这里来看一个使用 Opacity 的实例。首先来看 HTML：
<div >
<div >
<p>我是bg的后代元素，我不想我的前景有任何透明!怎么办?</p>
</div>
</div>
</div>
先给他们附上相应的样式：
width: 200px;
height: 100px;
border: 1px solid #ccc;
background: red;
position: relative;
}
.bg {
background: black;
opacity: 0.5;
filter:alpha(opaity=50);
width: 100%;
height: 50px;
position: absolute;
bottom: 0;
left: 0;
}
.bg p {
padding: 5px 10px;
color: white;
}
效果：
从效果中我们明显的看出，这里和我们前面那个例子一样，名叫 bg 的 div 中设置了Opacity，造成其后代元素段落P的前景色也随着变了。如果需要解决这样的问题，在不使用别的新技术下，也就是说坚持使用 Opacity。那么我们就需要添加一个空的层，在这个地方应用透明背景层首先来看看改变一下 HTML 结构吧
SVG PATH 的d参数较多，也比较复杂。
- Moveto
- Lineto
- Curveto
- Arcto
- ClosePath
这里只打算记录下 Arcto 参数.（https://developer.mozilla.org/en-US/docs/SVG/Attribute/d）
Sometimes it is easier to describe a path as an elliptical curve rather than a Bezier curve. To this end, Arcto commands are supported in paths. The center of the arc is calculated from the other variables. The declaration of an arcto is relatively complicated: "A rx,ry xAxisRotate LargeArcFlag,SweepFlag x,y". To deconstruct, rx and ry are the radius in the x and y directions respectively, The LargeArcFag has a value of either 0 or 1, and determines whether the smallest (0) or largest (1) arc possible is drawn. The SweepFlag is either 0 or 1, and determines if the arc should be swept in a clockwise (1) or anti-clockwise (0) direction. x and y are the destination coordinates. Although the xAxisRotate is supposed to change the x-axis relative to the current reference frame, it seems that this argument has no effect with Gecko 7.
文字描述是挺难懂的，可以查看这个演示文件。http://jun-lu.github.com/lujun/svg/path.html
本文链接