我正在编写一个firefox插件，并使用面板在视频上显示信息，尽管我不能使面板透明，但一切正常。我在html文件中定义面板样式，如下所示:
<html>
<head>
<meta charset="utf-8" />
<style type="text/css" media="all">
html
{
opacity:0.1;
border-style:none;
resize:none;
}
textarea
{
background-color:transparent;
resize: none;
border-style:none;
}
</style>
</head>
<body>
<textarea id="text" readonly=true rows="3" cols="60"></textarea>
</panel>
</body>
</html>
除了面板不是透明的以外，只有文本区域是透明的。我尝试了:
文字区域的
opacity:1无论哪种方式都行不通。我究竟做错了什么？这有可能吗？
据我了解:
html
{
opacity:0.1;
border-style:none;
resize:none;
}
仅适用于面板内容，不适用于面板本身。我在此主题上找到了一个post，但是由于post中提到的sdk/panel.js不再相同，因此它已经过时了。
无论如何，我尝试下载panel.js并替换当前的面板，但它似乎丝毫不影响我显示的面板。面板仍为白色，并且
border-radius选项也不起作用。 (我应该说我用post中提到的所有“./”替换为“sdk/”)。 最佳答案
好的，这是一个纯插件SDK解决方案:
let myPanel = Panel({
width: 180,
height: 180,
contentURL: 'data:text/html,<textarea style="width:120px; height:80px;">this is my textarea</textarea>'
})
let { getActiveView }=require("sdk/view/core");
getActiveView(myPanel).setAttribute("noautohide", true);
getActiveView(myPanel).setAttribute("level", 'top');
getActiveView(myPanel).setAttribute("style", 'background-color:rgba(0, 0, 0, 0.2);');