デベロッパーツールの表示方法

パソコン

MacのSafariでデベロッパーツール(Webインスペクタなど)を表示する方法

普段はChromeをメインブラウザにしているんですが、ここ最近はSafariもよく使うようになってきました。そんな時にSafariでもWebインスペクタやソースコードを表示したいと思ったんですが、表示方法がイマイチ分かりづらい印象だったのでメモがてらご紹介します。

Safariの環境設定から開発メニューを表示

デベロッパーツールを表示させるやり方はSafariの環境設定から可能です。

上部メニューから「Safari」→「環境設定…」を開きます。ショートカットキー「command + ,」でも開くことができます。

Safariの環境設定を開く

続いてタブメニューから「詳細」を選択して、下にある「メニューバーに”開発”メニューを表示」にチェックを入れます。

開発メニューを表示させる

すると、先ほどまで上部メニューになかった「開発」が表示されるようになりました。

開発

あとは開発メニューからWebインスペクタを表示させたりすることができます。WebインスペクタのショートカットキーはChromeと同じで「command + option + I」になります。

そんなわけで、SafariでもChromeみたいにデベロッパーツールを使いたいという方は、普段から開発メニューを表示させておくのがよさそうです。

関連記事

  1. Skitchのエクスポート

    パソコン

    MacのSkitchでJPEGやPNGなどを指定してエクスポートするやり方

    MacのSkitchで特定のフォーマットを指定してエクスポートするやり…

  2. Mac版のExcelのセル内改行

    パソコン

    Mac版のExcelのセル内で改行したい時のショートカットキーのやり方

    ここ最近Mac版のExcelを使う機会があり、気になったことがあったの…

  3. パソコン

    MacのEvernoteで複数のノートを指定したノートブックに移動させるやり方

    Mac版のEvernoteで複数のノートを選択して自分が指定したノート…

  4. パソコン

    MacのATOK Padで文字のフォントサイズを変更する設定方法

    Macを使っていてちょっとしたメモを残したい時によく使うアプリがATO…

  5. Bywordでワード数と文字数の表示・非表示

    パソコン

    Bywordでワード数と文字数のカウンター表示・非表示を切り替えるショートカットキー

    Bywordで現在自分が入力しているワード数と文字数のカウンターを表示…

  6. Macでライブラリフォルダを表示

    パソコン

    Macで見えなくなったライブラリフォルダを表示させる方法

    Macでライブラリフォルダを探していたら、いつの間にかなくなっていたの…

最近の記事

  1. 田沢湖
  2. ハクバ シリコンクロス
  3. トライポッドスリーブ
  4. レンズペン3 ミニプロとレンズペン ELITE マイクロプロ

Instagram始めました

Facebookページ

PAGE TOP