第1回 詳説：デベロッパーツールの使い方 | gihyo.jp
こんにちは、Google Chrome ExtensionsのAPI ExpertとChromium-Extensions-Japan管理人を担当している、太田と申します。いつもはクロスブラウザで連載していますが、今回はGoogle Chromeのデベロッパーツールについて紹介します。 昨今のJavaScript、HTML、CSSブームの背景には、開発環境、特にFirebugに代表されるようなデバッグツールの目覚しい発展が大きく貢献していると思われます。その反面、高機能化するデバッグツールの各種機能を使いこなすことが難しくなってきているという現実もあります。そこで、今回から全4回でGoogle Chromeに搭載されているデベロッパーツールの使い方とそれを利用したデバッグ・チューニングのノウハウをお届けしたいと思います。第1回はデベロッパーツールの機能紹介と基本的な使い方を解説します。 な
Chromeの「デベロッパーツール」が神すぎて感動。CSS初心者な私でもサイトのカスタマイズがわかりやすい
Chromeデベロッパーツールの起動方法Google Chrome上で右クリックして「検証」を選ぶだけで、デベロッパーツールが起動します。 これで、現在開いているページのHTMLソースと、スタイルシートが表示されます。 この時点で拒否反応を示す人もいることでしょう・・・。その気持ちは痛いほどわかります。わけわからんアルファベットの羅列が飛び込んできたら、そっと閉じたくなりますよね。 でもちょっとだけ待ってください。 きっと今考えているよりも楽に、ブログのカスタマイズを試してみることができるはずなのです。 （少なくとも、私にとってはそうでした） HTMLソースが実際のブログ（サイト）のどの部分に対応しているかわかる！表示されたデベロッパーツールのHTMLソースにカーソルを合わせてみてください。 カーソルを合わせたところに対応する場所が、ハイライトされて表示されます。 つまり、「このHTMLソ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
