问题标签 [border-image]

我一直在尝试使用 border-image 属性，并试图制作一个 3x3 网格，外部有边框，每个单元格之间都有边框。问题是如果我像这样在表格单元格上使用边框图像属性：

每个单元格之间最终有两个边界。如果我的意思不太清楚，请参阅 http://codepen.io/katieyang/pen/RpKpNW?editors=0100 。

我怎样才能解决这个问题？

提前致谢！

我正在建立一个 wordpress 网站，但在尝试复制带有边框来源和图像的外观形状时遇到问题。我能够将边框添加到“方形”主要形状，但找不到将其添加到“三角形”部分的方法。

这是我到目前为止的代码。

您可以在此处查看开发站点：http: //662.d1e.myftpupload.com/。

我希望我能找到解决这个问题的方法。

提前致谢。

我不理解border-image CSS 函数的语法。

下面的 CSS 可以在正确的位置和宽度上生成边框，但图像本身严重倾斜。它没有被拉伸（如在 CSS 属性中），但它被压缩或其他一些我不清楚的 mod。

图像本身是一个简单的凯尔特结，我想在页眉底部的单行中复制它，这意味着在 x 轴上“圆形”或“重复”，但在 y 轴上没有变换或复制。

我有一个元素集，其边框图像不统一，需要在边缘重复。在除 Chrome 56.0.2924.76 之外的所有浏览器中都能完美运行，但在新旧版本的 chrome 中都很好。

在不起作用的版本中，它会在边缘重复，但不会在定义切片的地方重复。

（对不起，我不得不模糊一些内容，客户网站还没有上线）

https://jsfiddle.net/np1kmsut/1/

我需要通过旋转图像来渲染一个框架（即图片周围的相框）：

• 左侧 0 度
• 90 顶
• ... 等等。

据我所知，没有border-image-left|right|top|bottom财产，尽管这也可以-如果我错了，请纠正我。

看来我需要使用该border-image属性。有谁知道是否可以根据侧面旋转图像？

我想其他混乱的选择包括

• 在图像周围创建四个 div
• 手动生成边框图像（这不会真正起作用 1. 我们有 300 多张图像，2. 需要在具有不同纵横比的图像上使用边框...）

编辑：“取决于侧面”=左侧 0 度，顶部 90 度，右侧 180 度，底部 240 度...参见下图示例。

左边框图像

我对 CSS 很陌生，只是在玩。我在这里搜索了类似的问题，但找不到我想要的东西。

我在看这个关于 W3 的教程，我想添加一个边框。这是我当前的代码：

问题是当我添加宽度元素时，它会将所有内容（内部带有文本的边框）拉到左侧。我想要的是一切都以borderimage完美居中，而不是拉伸页面的整个宽度。

如果这没有意义，请告诉我；我可以添加图片。

任何帮助表示赞赏！另外我假设我的代码有点杂乱无章，所以任何关于组织或排序的一般提示都会有所帮助！谢谢！

我想在图像上有一个边框图像。边框图像不是直的，因此叠加层应该位于图像上方而不是后面。我用 z-index 试过了，但没用。边框不在我的图像上。

这是小提琴。

我已经用这个代码试过了：

（这就是我所做的）

（这就是我想要的）

如何使用标准以有效的方式在图像中的红色圆圈周围制作圆形图案边框图像？

需要一些好的建议。

问候

我有这个：

我想要的是：

是否可以仅对边框图像而不是内容应用不透明度？

我正在制作一个客户的网站，其中包含以下设计：

如您所见， 3 块具有可变的内容大小，但顶部是相同的。它还有一个微妙的渐变，贯穿整个形状。

为了完成设计，我做了一个 parent div，有 2 个子 div：.background& .content，它们相互重叠（position+ z-index）。

在里面.background，我有 2 div's: .triangle& .block。
由于.triangle具有固定高度 ( 220px)，因此渐变.block可以从-220px:开始linear-gradient(yellow -220px, green 100%)。
但问题是我的.blockdiv 的高度是可变的，所以我不知道在哪里结束.triangle's 渐变。

此外，如果我使用border-imageon .triangle，我的三角形会丢失。只有在可能的情况下，我才想在 CSS 中做到这一点。

我把一点 JSFiddle 放在一起让我的问题更清楚：https ://jsfiddle.net/c1pgeq7j