環境
Mac / Chrome
他のブラウザでもできるかもだけど、個人的にはChromeが使いやすいので。
ソースコードをチェックする
ブラウザの適当な場所で、Winなら右クリック、MacならCtrl + 左クリックでコンテキストメニューを表示して検証をクリックする。
そうすると、右側（設定による）にウィンドウが表示される。
※画像クリックで拡大表示します。
上部にあるヘッダータブでElementsを選ぶと、表示中のページのソースコードが表示される。
HTMLタグをクリックするか、左側の表示窓で調べたい要素の上でコンテキストメニュー>>検証をクリックすると、それに付与されたCSSが下に表示される。（Stylesのタブにしておくこと）
適当なスタイルをクリックすると、上図のように、青いチェックボックスが表示される。ここで各CSSごとに有効/無効を切り替えられる。
また、そもそも適応できないCSSなどもチェックできるので便利。
左側の表示窓には、選択された要素の範囲が表示される。
色分けについては、画面内で確認できるけど、一応貼っておく。
Chromeでスマホ表示をチェックする
（１）ソースコードを表示した状態で、ヘッダータブElementsの左横にあるマークをクリック。
戻す時も同じボタンをクリックすると戻る。
（２）ブラウザを再読み込みする。
以上
