google-chrome-extension - Chrome extension transparent background and rounded corners (like Save To Pocket)

Question

So this plugin clearly has transparent background and rounded corners:

Even when you scroll down on the page the background will scroll behind it, so it's unlikely any trick with captureVisibleTab is being done.

So I'm wondering how this was achieved, because any other SO-articles seem to suggest it is impossible, however they are pretty old:

• Make Chrome Extension Popup Window Transparent
• How to make border radius in popup chrome extension?
• Curved corners on a popup.html?

I'm curious what kind of hack they have used, or that I'm missing something obvious in the docs.

For me at least simply setting background-color: transparent; on any element in the popup.html does not do anything.

Have they used a trick by loading 2 separate html files with an offset? That still doesn't explain the rounded corners though.

Answer 1

正如@woxxom 指出的那样，“弹出窗口”是在页面本身上呈现的，而不是在popup.html 中。

您可以看到它与通常显示插件的位置的偏移量。