Please note, this is a STATIC archive of website developer.mozilla.org from 03 Nov 2016, cach3.com does not collect or store any user information, there is no "phishing" involved.

ボックスモデルの調査と編集

ボックスモデルの確認

要素選択ボタンを押しているとき、ページ上で要素にマウスポインタを載せると、要素のボックスモデルをオーバーレイで表示します:

HTML ペインで要素のマークアップにマウスポインタを載せた場合も、同様にオーバーレイで表示します:

Firefox 39 より、要素がインライン要素であり複数の行ボックスに分かれている場合は、要素を構成するそれぞれの行ボックスをハイライト表示します:

ボックスモデルビュー

要素を選択すると、ボックスモデルビューでボックスモデルを詳しく調べることができます:

Firefox 40 より、値にマウスポインタを載せると、その値がどのルールに由来するかを示すツールチップを表示します:

ボックスモデルビューでボックスモデルの一部にマウスポインタを載せると、ページ上で対応する部分をハイライト表示します:

ボックスモデルの編集

ボックスモデルビューでは値の編集も可能であり、変更結果はページへ即座に反映します:

ドキュメントのタグと貢献者

タグ: 
 このページの貢献者: yyss, jsx
 最終更新者: yyss,