Question

有没有办法让元素的边框半透明？使用纯粹的CSS？喜欢facebook使用的模态窗口吗？

Answer 1

您可以使用rgba()，background-color: rgba(255,0,0,0.5);与background-color: rgb(255,0,0); opacity: 0.5;相同

对于您的边框，请执行以下操作border: 3px solid rgba(255,0,0,0.3);

http://jsfiddle.net/robert/b3e3v/

Answer 2

RGBA只是答案的一半，另一半是背景剪辑。见那里：http://css-tricks.com/transparent-borders-with-background-clip/

Answer 3

使用两个div ...一个用于边框，另一个用于内部区域。然后将外部div的背景颜色设置为具有透明度值：

background-color:rgba(0,0,0,0.5);

Answer 4

嗯，你可以用hackish的方式做到这一点。这是一篇关于如何围绕标题部分制作透明/半透明边框的文章：

Transparent borders

Answer 5

<div id="lightbox">
/* Set transparent background with PNG
   add padding to push inside box inward */

  <div id="lightbox-inside">
    /* Set white background in here */
  </div>

</div>

2 divs意味着适当的可比性。只记得设置你的不透明度（分别为ie和所有其他）

Answer 6

是的，你可以轻松实现这一目标！使用此代码：

border: 14px solid rgba(0,0,0,0.50);

0.50是不透明度！

希望它有所帮助！

透明边框与CSS 3

6 个答案: