如何设置边框的不透明度[重复]

Posted 2023-03-06

技术标签:

【中文标题】如何设置边框的不透明度[重复]【英文标题】：How can I set the opacity of border [duplicate] 【发布时间】：2013-10-06 00:57:42 【问题描述】：

如何设置边框的不透明度？

我希望它是透明的，以便可以看到边框后面的对象。

【问题讨论】：

查看***.com/a/4062032/1305911 【参考方案1】：

你不能做到这一点。因为“objects behind the borders”就是对象本身。

检查这个Fiddle

【讨论】：

【参考方案2】：

选择任何带有 alpha 通道的 CSS 颜色函数：

rgba(RR, GG, BB, ALPHA) 或 hsla(HUE, SAT, LUM, ALPHA)

alpha 值在0 和1 之间。

您可能还想查看background-clip 属性，以定义背景相对于元素盒子模型的位置。

【讨论】：

【参考方案3】：

您可以在现代浏览器中使用rgba 格式。

border: 2px solid rgba(0, 51, 255, 0.5)

您可以在所有现代浏览器中使用它。这是list

【讨论】：

【参考方案4】：

我认为这样的事情应该可以解决问题：

border: 10px solid rgba(255, 255, 255, 0.5);

更多信息：http://www.css3.info/preview/rgba/

【讨论】：

【参考方案5】：

试试这个，

border-color: rgba(0,0,0,0.5); // 50% opacity

最后一个值从 0 到 1 不等。其中 0 是完全透明的，1 是不透明的。

【讨论】：

快 30 秒。 +1

以上是关于如何设置边框的不透明度[重复]的主要内容，如果未能解决你的问题，请参考以下文章