我知道如何使用CSS3指定多个背景图像并使用不同的选项修改它们的显示方式。

目前,我有一个<div>,它需要在左侧宽度的30%处具有不同的颜色:

div#content {
  background: url("./gray.png") repeat-y, white;
  background-size: 30%;
}

而不是加载完全为灰色的图像,我该如何指定颜色并且没有其他<div>呢?

最佳答案

您真的不能—背景颜色完全适用于元素背景。保持简单。

您可以改为为背景定义带有锐利颜色边界的CSS渐变,例如

background: -webkit-linear-gradient(left, grey, grey 30%, white 30%, white);

但是目前只有少数浏览器支持。参见http://jsfiddle.net/UES6U/2/

(另请参阅http://www.webkit.org/blog/1424/css3-gradients/以获取CSS3渐变的说明,包括清晰的颜色边界技巧。)

关于css - 我可以在CSS3中应用多种背景颜色吗?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/6457406/

10-11 06:01