SafariのWebインスペクタ

  • 投稿日:
  • カテゴリ:

DIVタグの整合性やJavaScriptなど、HTMLのチェックをするのに非常に便利なツールはないものかと思っていたとき、SafariのWebインスペクタを試しました。

タグが閉じられているかどうかのチェックはもちろん、JavaScriptで動的にHTMLが書き換わっているときのソースを確認することができます。クラスがどこを差しているのか、marginやpaddingの範囲も表示します。

CSSが最終的にどのように有効になっているかもわかります。

これは、ブログのテンプレートを編集しているときに非常に役に立ちます。どれほど助けられたか。ウェブ管理をしている人なら、必須ツールですね。

この機能を使うには、マックの場合、Safariのメニューの環境設定から、Windowsの場合は、[編集]→[設定]を開きます。
[詳細]タブを選択し、[メニューバーに"開発"メニューを表示]にチェックを入れます。
プラグインでも何でもありません。標準機能です。

リンクソース

  • 記事用リンクソース:
  • Wiki用リンクソース(PukiWiki):
  • Wiki用リンクソース(MediaWiki):
  • SNS投稿用: