広告を利用しています

当サイトは広告を掲載しています。消費者庁が2023年10月1日から施行した景品表示法の規制対象(通称:ステマ規制)にならないよう配慮して記事を作成しています(記事はこちら、消す方法はこちら

【Vivaldi】右上の閉じるボタンを押せないようにするCSS

カスタムCSS

「Vivaldi」ブラウザのアイコン画像

この記事では、Windows版「Vivaldiヴィヴァルディ」ブラウザのオリジナルカスタムUI機能を使って、右上にある「閉じるボタン(終了)」を押せないようにする、あるいは非表示にするCSSについて書きます。

PC版「Vivaldi」の右上にある閉じるボタンを非表示にしたイメージ画像

本記事で紹介するCSSを使うことで、Windows版「Vivaldi」ブラウザの右上にある「×」ボタンを無効化できます。

マウスフォーカスしてクリックしても反応しなくする=終了できなくすることが可能です。または閉じるボタン自体を消し去ってその横にある最大化ボタンを右詰めにすることも可能です。

「最大化しようと思ったらうっかり閉じるボタンを押してしまう時がある!そもそも押せないようにしたい!終了する場合はクイックコマンドやショートカットキー、Vivaldiメニュー内を利用するから右上の×ボタンは完全にいらない!」という方参考にしてみてください。

水平タブ、垂直タブどちらにも対応しています。

CSSで非表示にしているだけなのでいつでも元に戻せます。最小化、最大化ボタンはこれまで通り表示します。合わせて非表示にすることも可能です。

本記事は既にオリジナルカスタムUI機能が有効になっている前提です。まだ有効にしていないという方は以下の記事を参考にしてみてください。

本記事はヘビーユーザー向けです。ライトユーザーさんにはおすすめしません。閉じるボタンを消すとかえって不便だと思います。

Vivaldiの「×」ボタンを押せないようにするCSS

押せなくするCSS

「バツアイコンは表示したまま押せないようにしたい!」という方は以下のCSSになります。ボタン自体を消したい方はこちらを参考にしてみてください。

CSS
/*ブラウザ右上の「閉じるボタン」を押せなくする*/
.window-buttongroup button.window-close {
  pointer-events: none !important;
}

上記のCSSをテキストエディター(Visual Studio CodeやWindows標準でインストールされているメモ帳アプリなど)でファイルに書き込みます。

「Visual Studio Code」を使って「Vivaldi」ブラウザ右上の閉じるボタンを押せなくするCSSを書き込んだ画像

ブラウザを再起動してマウスカーソルを「閉じるボタン」の上に乗せます。

本来なら背景が赤くなりクリックできるのですが、「pointer-events: none;」で無効化しているので何も反応しなくなります。

「Vivaldi」のブラウザ右上にある閉じるボタンをCSSで押せなくした画像

動画を貼っておきます。副作用で閉じるボタンをダブルクリックすると最大化されてしまいます。これはVivaldiのせいではなくWindowsの仕様です。

非表示にするCSS

閉じるボタン自体を抹消して最大化ボタンを右に詰めたい場合は以下のCSSになります。

CSS
/*ブラウザ右上の「閉じるボタン」を非表示にする*/
.window-buttongroup button.window-close {
  display: none !important;
}

閉じるボタンがスペースごと消えます。最大化と最小化ボタンが右端に詰められます。

Windows版「Vivaldi」ブラウザの閉じるボタンをCSSで非表示にした画像

水平タブを使っている場合でも一緒です。

閉じるボタン以外でVivaldiを終了する方法

以下の記事を参考にしてみてください。

感想

以上、Windows版「Vivaldi」でCSSを使って右上の×ボタンを非表示にする方法でした。

やっぱり元通り表示させたい場合は書き込んだCSSコードを削除してブラウザを再起動します。

2022年4月30日カスタムCSS

Posted by ナポリタン寿司