css3 惭变效果
发布日期: 2012-07-02 00:00:00
点击次数: 5900
点击次数: 5900
大字
小字
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>css3 惭变效果</title>
</head>
<style>
body{
background:#096;
}
.final{
background: -webkit-linear-gradient(top, rgba(135,224,253,1),rgba(83,203,241,0.5) 20%,rgba(5,171,224,0)); /* Chrome10+,Safari5.1+ */
background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(128,128,128,.8)), color-stop(0.2, rgba(255,255,255,.5)), to(rgba(255,255,255,0)));
height:300px;
}
</style>
<body>
<div class="final">惭变效果
</div>
</body>
</html>