「[[.NET 開発基盤部会 Wiki>http://dotnetdevelopmentinfrastructure.osscons.jp]]」は、「[[Open棟梁Project>https://github.com/OpenTouryoProject/]]」,「[[OSSコンソーシアム .NET開発基盤部会>https://www.osscons.jp/dotNetDevelopmentInfrastructure/]]」によって運営されています。
-[[戻る>HTML/CSS/JavaScript]]
*目次 [#p45bc549]
#contents
*概要 [#z3574fbf]
Chromeなどにて、F12を押下することによって「開発者ツール」を起動してデバッグできる。
*詳細 [#rca55253]
**[[HTML]] [#p60bc34b]
「開発者ツール」の[Element]タブに遷移すると、[[HTML]]を確認できる。
**[[CSS]] [#of5a7400]
「開発者ツール」の[Element]タブに遷移すると、[[CSS]]も確認できる。
**[[JavaScript]] [#xddfb165]
-「開発者ツール」の[Sources]タブに遷移すると、[[JavaScript]]をデバッグできる。
-Reactでデバッグを行う方法については、[[コチラ>Reactのファースト・ステップ#v9b02d5b]]。
-参考
--Chrome DevTools で JavaScript をデバッグする~
Tools for Web Developers | Google Developers~
https://developers.google.com/web/tools/chrome-devtools/javascript/?hl=ja
*デバッグ例 [#v8fe8491]
デザインが崩れるので比較してみたところ、~
タグのmarginに問題があることが確認できた。
**デバッグ１ [#ma8fbc90]
#ref(CSSdebug1.png,left,nowrap,デバッグ１,60%)
**デバッグ２ [#ec7aa9b2]
#ref(CSSdebug2.png,left,nowrap,デバッグ２,60%)
*参考 [#o296ade0]
![[PukiWiki]](image/pukiwiki.png "[PukiWiki]")
