公開日:2014年6月13日 最終更新日:2018年6月29日 Chrome デベロッパーツールのElementsパネルでは、WebページのHTML/CSSを検証することができます。Web制作者が最もよく使うデベロッパーツールの機能です。ブラウザでの表示がおかしい時は、とにかくこの機能を使ってデバッグするのが問題解決の早道となります。 Elementsパネルでは具体的に以下のことが可能です。 ページに表示している要素に対応するHTMLとCSSを検索する。 HTMLを編集してページ内容を変更する。 CSSを編集してページスタイルを変更する。 DOM elementにブレークポイントを設定してデバッグする。 要素に設定されたイベントを確認する。 【コンテンツ】 Elementsパネル外観 ナビゲーション部 DOMツリーの操作 要素を検索する 要素のHTML/CSSを確認する HTMLを編集する