1

因此，我有几个位置背景图像和背景颜色，并且图像具有透明边缘，我想知道是否可以从图像透明的位置消除背景颜色。

我目前得到这个Image。

并想得到这样的东西Image。

PS 很抱歉只是将图片作为链接发布，但在发布此帖子时，我不允许实际发布图片。

网页：desertednoir.uhostfull.com

相关代码：

#content {
    padding: 1.5%;
    float: left;
    width: 73%;
    text-align: center;
    z-index: 1;
    color: Silver;
    border: 1px solid black;
    background: url("/images/e_bl.png") no-repeat left bottom,
    url("/images/e_tr.png") no-repeat right top,
    url("/images/e_tc.png") no-repeat center top,
    url("/images/e_br.png") no-repeat right bottom,
    #3C3C3C;
}

<div id="content">内容资料</div>

4

1 回答 1

2

仅 HTML 和 CSS 不足以编辑图像以添加或删除透明像素。但是，除非您告诉他们，否则他们也不会添加颜色。只要确保您的元素上没有指定background-color，它将保持透明。

我已将您的示例代码放入http://jsfiddle.net/XQumV/。如您所见，如果您, #3C3C3C从规则的末尾删除background，那么您的元素是透明的。

因为 HTML 中的元素本质上是矩形的，所以它们的背景颜色也总是矩形的。不要使用background-imageto 获取复杂的背景图像，而是尝试使用border-image. 有关详细信息，请参阅https://developer.mozilla.org/en-US/docs/CSS/border-image。

于 2012-12-03T20:06:12.907 回答