0

我有一个要阻止引用的背景图像，但我希望它从阻止引用的底部停止 30 像素左右。

当前的CSS：

.project-inner-quotes blockquote
{
  background: url("Img/quoteTop.gif") no-repeat scroll center top transparent  ;
  margin: 0 3px 0 3px;
  font-style:italic;
  font-size:14px;
}

原因是我在引语中有 ap 标签，其中有闭幕词buuble ... 

.project-inner-quotes blockquote > p:last-child 
{
    background: url("Img/quoteBot.gif") no-repeat scroll center bottom transparent;
    padding: 30px 20px 50px 50px;
 }
4

1 回答 1

1

这可以用 css 以一种棘手的方式“伪造”，因为它取决于您的设计。我现在做一些假设，首先你的 blockquote 容器元素有一个 #fff 背景（实际上可以是任何颜色）。

在这种情况下，您可以这样做：

.project-inner-quotes blockquote > p:last-child {
    background: url("Img/white-image_8x30") repeat-x scroll left bottom transparent;
}

.project-inner-quotes blockquote > p:last-child span {
    background: url("Img/quoteBot.gif") no-repeat scroll center bottom transparent;
    padding: 30px 20px 50px 50px;
    display: block;
}

这将“假”从底部偏移 30px。将您的 p 文本包装在将获取背景图像和显示块以应用填充的跨度内。

您将需要创建一个 8px 宽（为了更好地平铺）和 30px 高的图像，该图像将应用于底部的段落。图像的颜色将是您在“偏移”quoteTop 图像时尝试获得的背景颜色......但是，如果您没有纯色作为主要背景，则此方法将失败。

如果不清楚，请告诉我

于 2012-06-01T11:36:47.643 回答