# 無邊框視窗無邊框視窗是一種特殊的視窗模式，它不帶有外殼（包括視窗邊框、標題欄、工具欄等），只含有網頁內容。使用無邊框視窗模式可以讓您完全自定視窗介面，讓您的應用程式在所有作業系統上的風格都保持一致。不過，由於無邊框視窗沒有系統自帶的外殼，因此在使用時需要注意，以免影響使用者體驗。 ## 新增無邊框視窗在 `manifest.json` 檔案中，將 `window` 物件的 `frame` 屬性設定為 `false`，即可啓用無邊框視窗模式。 ```json { "id": "LB5UL2P0Q9FFF", "version": "1.0.0", "name": "Hello World", "logo": "/logo.png", "keywords": ["keywrod1", "keywrod2"], "main": { "frame": false, // 👈 無邊框模式 "url": "index.html", "width": 640, "height": 480 } } ``` ## 可拖曳區您可以在應用程式中使用 `-webkit-app-region` 屬性，來控制應用程式視窗的可拖曳區域。預設情況下, 無邊框視窗是不可拖曳的。應用程式需要在 CSS 中指定 `-webkit-app-region: drag` 來告訴插件哪些區域是可拖曳的（如作業系統的標準標題欄），在可拖曳區域內部使用 `-webkit-app-region: no-drag` 則可以將其中部分區域排除。請注意, 當前只支援矩形形狀。要使整個視窗可拖曳, 您可以新增 `-webkit-app-region: drag` 作為 `body` 的樣式: ```html ``` 請注意，如果您使整個視窗都可拖曳，則必須將其中的按鈕標記為不可拖曳，否則使用者將無法點擊它們： ```css button { -webkit-app-region: no-drag; } ``` 如果只將自定標題欄設定為可拖曳，還需要使標題欄中的所有按鈕都不可拖曳。