问题标签 [border-image]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
429 浏览

image - 使用 BorderImage 时如何设置红色轮廓边框

我正在使用BorderImage在GridView上显示图像。

以下是我正在做的事情:

我想为我的图像设置一个红色轮廓边框我该怎么做

我查看了Border.left,Border.right属性,但它们只是拉伸图像。

0 投票
3 回答
849 浏览

html - 单个 div 中的不同边框

我在使用 css 在我的 div 中有不同的边框时遇到问题。我需要一张在 div 的左侧、顶部和右侧具有“正常”实心边框的卡片 (div)。但是,在底部,我需要一个特定的边框图像。

我可以将图像放在底部边框或三个边的“正常”边框,但我不知道如何同时拥有两者。

当我放置图像时,它会覆盖所有边界。

我正在使用以下代码到底部图像边框:

你知道有什么方法可以在三个边上有一个普通的实心边框,在底部边框上有一个图像吗?

如果我将 更改border-width为大于零,则会出现图像,而不是正常的实心边框。

提前致谢!

0 投票
1 回答
1062 浏览

twitter-bootstrap - 边框图像引导

我正在尝试使用 iphone frame png 作为表单的边框,但无法弄清楚。下面是 .html 和 .css 。如您所见,我已尝试将视频作为背景图像和单独的对象。

这是我们尝试使用的框架: iPhone Frame

这是我们现在的样子(它是右边的表格,带有jumbotron): 表格截图

HTML

我相信答案是边界图像,但它对我不起作用。

我想知道是否有办法将图像文件放在表单元素的顶部。

谢谢你的帮助!

0 投票
1 回答
48 浏览

css - div上的不同边框图像

我试图在同一个 div 上使用 2 个不同的边框图像:一个图像沿顶部重复,一个沿底部重复。

我可以让底部边框图像显示。我也可以在顶部重复相同的边框图像,但是一旦我尝试使用border-bottom-image或border-top-image,都不会显示:

这可能吗?

0 投票
1 回答
46 浏览

css - 边框图像>内容后面的半透明png

我有一个照片库,我为它创建了一个框架,顶部有一点透明胶带。我希望它看起来像贴在我背景上的宝丽来。胶带可以完美地贴在背景上,但我希望它也可以放在图片的前面。我在图片上使用负边距以使其与框架重叠。不幸的是,这张照片似乎在我的画框前面。

提前感谢互联网的代码之神。

这是我的 HTML:

0 投票
1 回答
366 浏览

css - 具有边框半径的边框图像 - 但没有边框颜色覆盖

我想创建一个透明的圆形按钮,点击它应该有一个条纹边框。我想用 HTML、CSS 或必要的 java-script 来做这件事。

这里是一个例子:https ://jsfiddle.net/chrichrichri/a9dpg582/38/

结合:

到目前为止,我在 Firefox 中对其进行了测试——边框图像考虑了边框半径,但总是有一个边框颜色叠加层——如果我有 50% 的透明度,我会看到条带和选定的颜色——但我只想要条带……如果我使用 transparent/rgba(0,0,0,0) 边框根本不显示。为什么?如果有人能解释这里发生了什么,我会很高兴:-)

7 年前已经讨论了一个类似的主题 - 但那里给出的解决方案仅适用于具有实心填充的元素 - 好的,您可以添加一个 svg 椭圆而不是边框​​ - 但也许现在有一个更简单的解决方案。(可以将边界半径与具有渐变的边界图像一起使用吗?

0 投票
0 回答
405 浏览

css - 使用视差滚动创建整页边框图像

我正在尝试在前景中创建一个具有视差滚动和整页边框图像的网站,当您向下滚动时,所有文本/容器都将进入该图像。我正在考虑将边框图像拆分为左右边栏、页眉和页脚,但我担心它的可扩展性。有没有一种方法可以在前景中创建一个具有透明中心的整页边框图像,页面主体将转到该页面的主体,同时在页面主体中仍然具有可点击的链接(技术上是背景)?我正在使用 Rails 5、Bootstrap 3 和 Skrollr 来实现视差效果。

现在我的修复是:

应用程序.html.erb:

这是相关的CSS:

0 投票
0 回答
45 浏览

css - 缩放后,borderImage 显示不需要的透明线

我使用borderImage来显示一张图片(没有比例),它可以正常显示。但是如果我缩放它(transform:scale(1.2)),borderImage 会有不需要的透明线。有没有办法解决这个问题?

chrome 版本为:版本 63.0.3239.132(官方构建)(64 位)

测试代码如下:

0 投票
1 回答
73 浏览

html - 一个垂直的 div,左右两边都有一个图像模式

所以我正在尝试制作这样的 div在此处输入图像描述

但我希望它是垂直的,因为我希望 div 有两种像纸一样的外观:这是垂直 div,我希望上面的随机卷曲边缘位于 div 的左侧和 在此处输入图像描述 右侧第二张图片你看到一个蓝色的边框。我尝试使用边框图像来做到这一点,但这似乎并没有真正起作用,因为我尝试使用的边框图像的随机模式。

我现在拥有的CSS:

这是我尝试使用的边框:在此处输入图像描述

0 投票
1 回答
1108 浏览

html - 如何使用带有边框图像的径向渐变

我正在尝试使用源是径向渐变的边框图像。我已经看过很多带有图像的示例,但没有看到带有径向渐变的示例。

My CodePen中的完整示例

我只是想用间隔几个像素的小圆圈围绕盒子,最好使用纯 CSS 解决方案。虽然我很高兴听到其他问题