我使用的是 Chrome 版本 24.0.1312.25 beta-m，我正在尝试为一个小网站获取径向渐变，它似乎无法在 Chrome 中正确显示。
我使用的 CSS 是:
html {
background: -webkit-radial-gradient(circle, rgb(255, 255, 255), rgb(0, 0, 0));
}
使用 HTML:
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" type="text/css" href="dHb.css" />
</head>
<body>
</body>
</html>
它显示为:http://i.imgur.com/GCWyF.jpg
首先，它不是径向的。其次，如果你仔细看，正中央有一个带。
有谁知道为什么会这样以及我可以做些什么来让它发挥作用？
最佳答案
试试这个
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" type="text/css" href="dHb.css" />
</head>
<body>
</body>
</html>
CSS
html {
height: 100%;
}
body {
height: 100%;
margin: 0;
background-repeat: no-repeat;
background-attachment: fixed;
/* fallback */
background-color: #2F2727;
background-image: url(images/radial_bg.png);
background-position: center center;
background-repeat: no-repeat;
/* Safari 4-5, Chrome 1-9 */
/* Can't specify a percentage size? Laaaaaame. */
background: -webkit-gradient(radial, center center, 0, center center, 460, from(#FFFFFF), to(#000000));
/* Safari 5.1+, Chrome 10+ */
background: -webkit-radial-gradient(circle, #FFFFFF, #000000);
/* Firefox 3.6+ */
background: -moz-radial-gradient(circle, #FFFFFF, #000000);
/* IE 10 */
background: -ms-radial-gradient(circle, #FFFFFF, #000000);
/* Opera cannot do radial gradients yet */
}
关于html - Chrome 径向渐变显示不正确，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/13614296/