我用radial-gradient做了重复背景图，出了点小问题，很让人疑惑
div{
width: 400px;
height: 400px;
background-color: #ecf0f1;
background-size: 100px;//背景颜色和背景大小设置放在前面
background:-webkit-radial-gradient(0 100%,circle,#3498db 35%,transparent 35%)
,-webkit-radial-gradient(0 0%,circle,#3498db 35%,transparent 35%)
,-webkit-radial-gradient(100% 0%,circle,#3498db 35%,transparent 35%)
,-webkit-radial-gradient(100% 100%,circle,#3498db 35%,transparent 35%);
/*background-color: #ecf0f1;
background-size: 100px;*/背景颜色和背景大小设置放后面
}
</style>
</head>
<body>
<div>
</div>
</body>当我把background-color和background-size放在后面，他就能显示出我想要的效果。
但是当我把background-color和background-size 放前面的时候，就两个都不会生效，这到底是为什么
115
收起
正在回答
1回答
应该是顺序关系，background-color和background-size 在前面，相当于背景色匹配整个区域。background-color和background-size 在后面，按代码执行顺序，同时对background:radial-gradient也起作用。
HTML5与CSS3实现动态网页 2018
- 参与学习 1887 人
- 提交作业 4643 份
- 解答问题 5760 个
有HTML和CSS基础，却不知道如何进阶？本路径带你通过系统学习，完成从“会做网页”到“做出好的动态网页”的蜕变，迈出成为前端工程师的第一步。
了解课程
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星