如何在宽度和高度上制作半径200px?我已经读到这可以用像素单位完成,但每次尝试都失败了。
background-image: -webkit-radial-gradient(75% 100%, circle farthest-corner, #ffffff, #ff7ae9 33%);
background-image: -o-radial-gradient(75% 19%, circle farthest-corner, #ffffff, #ff7ae9 33%);
background-image: -ms-radial-gradient(75% 19%, circle farthest-corner, #ffffff, #ff7ae9 33%);
background-image: radial-gradient(75% 19%, circle farthest-corner, #ffffff, #ff7ae9 33%)
background-image: -moz-radial-gradient(75% 19%, circle farthest-corner, #ffffff, #ff7ae9 33%);
答案 0 :(得分:5)
编辑:添加所有供应商前缀以使其更清晰
background-image: -moz-radial-gradient(50px 100px, circle farthest-corner, #ffffff, #ff7ae9 200px);
background-image: -webkit-radial-gradient(50px 100px, circle farthest-corner, #ffffff, #ff7ae9 200px);
background-image: -o-radial-gradient(50px 100px, circle farthest-corner, #ffffff, #ff7ae9 200px);
background-image: -ms-radial-gradient(50px 100px, circle farthest-corner, #ffffff, #ff7ae9 200px);
background-image: radial-gradient(50px 100px, circle farthest-corner, #ffffff, #ff7ae9 200px);
在此示例中,'200px'是圆的大小,任何标准CSS单位(如px,em或百分比)都可以。
'50px 100px'是圆心的位置,它的工作方式与background-position相同,所以像'左上'这样的值也很好。
有一些online generators可以帮助您使用所有供应商特定的前缀。
P.S。
@Mohsen像素值很好,MDN说:
0%和100%之间的百分比或沿梯度轴的长度
如果您点击“length”,则说明
长度的CSS语法是一个紧跟一个单位的数字。不允许数字和单位之间的空格。