gradient = linear-gradient() | repeating-linear-gradient() | radial-gradient() | repeating-radial-gradient()gradient允许使用简单的语法实现颜色渐变,以便UA在渲染页面自动生成图像。渐变在一个拥有尺寸的盒子中被生成,被称之为渐变盒,但是渐变本身并没有内在的尺寸,也就说如果在一个没有尺寸的容器上定义渐变,将无法被呈现。gradient可以应用在所有接受图像的属性上
<!DOCTYPEHTML>
<html>
<head>
<meta charset="utf-8">
<title>径向渐变</title>
<style type="text/css">
div {
width:400px;
height:200px;
background-color:#F90;
background:-webkit-gradient(radial,200 100,10,200 100, 100, from(#f90),to(#0f0),color-stop(50%,blue));
background:-moz-radial-gradient(200px 100px,circle,#f90 10px,blue,#0f0 100px);
}
</style>
</head>
<body>
<div></div>
</body>
</html>
转载请注明原文地址:https://ipadbbs.8miu.com/read-46469.html