html - 带有半透明黑色背景的白色文本框 - 需要灯箱吗?

标签 html css google-chrome

我正在尝试制作一个 chrome 扩展以与我的 android 应用程序一起使用,我需要为其编写 html/css 代码;与扩展程序交互后,您可以将标签添加到特定页面,有点像口袋。

我已经设法创建了页脚,但现在我被添加标签 html/css 困住了,我是否需要使用灯箱来实现以下外观:enter image description here

如果没有,关于我应该做什么的任何提示或教程?

谢谢

最佳答案

插入 2 个 div:CSS

/* ID OVERLAY */
#overlay {
position absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: #000; /* or transparent pixel 
opacity: 0.3; /* your transparecy */
z-index: 1000; /* Must just be higher than your layout, 1, 2, whatever */
}

/* ID Lightboxlike Content */

#LBcontent {
position relative;
top: 200px;
width: 600px;
height: 300px;
background: #fff;
margin: auto;
z-index: 2000; /* Higher than the first one #overlay */

不需要灯箱

问候

T

关于html - 带有半透明黑色背景的白色文本框 - 需要灯箱吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20956540/

相关文章:

css - 当我改变它们的工作顺序时怎么办?

google-chrome - 有没有办法将 Chrome 应用程序快捷方式添加到 Google Chrome 中的书签栏?

html - 为什么 viewbox 属性会影响 SVG 元素的大小?

javascript - Canvas 内存泄漏

html - 倾斜的字体被 text-align :right 截断

javascript - 为结账添加一天的开始日 pikaday datepicker

javascript - 更新条形图时删除旧文本标签

javascript - 无法从外部 JavaScript 调用函数

html - 有什么方法可以查看 chrome iOS CSS 吗?

javascript - Ajax 请求在 Chrome 中成功,但在 Firefox 中失败