Chromeブラウザの開発者ツール
CSSの調整をするときは、開発者ツールを使う。
CSSの調整をしたいページを表示した状態で、F12を押すと開発者ツール（DevTool）の画面が出る。
開発者ツールの Elements のタブ内で、CSSの調整をしたい要素を選択するか、開発者ツール画面左上の□に矢印が付いているアイコン（Select an element in the page to inspect it）をクリックして、ブラウザ上に表示されている要素をクリックする。
選択した要素に対するCSSの内容が、開発者ツール画面下の Styles タブに表示されるので、そこの element.style {} 内に新しく指定したいCSSを追加したり、既存CSSのチェックボックスをON/OFFするなどして、表示内容を確認しつつCSSを調整する。
うまく表示できるようになったら、それをHTMLテンプレートやCSSファイルなどに、その内容を反映させると効率よく調整できる。
新しい共有フォルダ
\\abkcnas01\授業資料・OC資料\澤田