张经纬的博客-分享互联网

body {
	background:url(http://www.google.com/intl/en_ALL/images/logo.gif) repeat;
}
#wrap_1 {
	width:300px;
	padding:20px;
	color:#F00;
	background:#000;
	position:relative;
	filter:alpha(opacity=50);
	-ms-filter:"alpha(opacity=50)";
	-moz-opacity:0.5;
	-khtml-opacity: 0.5;
	opacity:0.5;
}
#wrap_2 {
	width:300px;
	padding:20px;
	color:#F00;
	position:relative; /*父元素为相对定位*/
	overflow:hidden;
}
#wrap_2_content {
	position:relative; /*内容相对定位，盖在透明层上*/
}
#wrap_2 .fixopacity {
	width:340px;
	background:#000;
	height:32768px; /*一个足够高的高度*/
	position:absolute; /*使用绝对定位*/
	top:0;
	left:0;
	z-index:-1; /*置于最低层*/
	filter:alpha(opacity=50);
	-ms-filter:"alpha(opacity=50)";
	-moz-opacity:0.5;
	-khtml-opacity: 0.5;
	opacity:0.5;
}
.bk10 {height:10px; font-size:1px; clear:both; overflow:hidden;}

<div id="wrap_1">
  <h1>没有取消透明度的继承的样子</h1>
  <p>当我们设置了父级元素透明度的时候，子元素往往都会继承这个透明度。本例旨在演示取消这个透明度。<br />
    <br />
    <img src="http://at.the9.com/images/library/common/library_logo.png" width="105" height="113" /></p>
</div>
<div class="bk10"></div>
<!-- 主代码 -->
<div id="wrap_2">
  <div id="wrap_2_content">
    <h1>取消透明度的继承的样子</h1>
    <p>当我们设置了父级元素透明度的时候，子元素往往都会继承这个透明度。本例旨在演示取消这个透明度。<br />
      <br />
      <img src="http://at.the9.com/images/library/common/library_logo.png" width="105" height="113" /></p>
  </div>
  <div class="fixopacity"></div>
</div>
<!-- 主代码 -->

$(document).ready(function(){
	$("p").bind("click", addF);
	function addF(){
		$(this).append("<p>hello</p>");
	}
});

$(document).ready(function(){
    $("p").live("click", function(){
      $(this).append("<p>hello</p>");
    });
});