問題タブ [inspector]

Chrome WebKit インスペクターの要素ビューですべての要素を展開する方法はありますか?

WebView を使用する OS X アプリケーションに WebKit Dev Tools Web インスペクタを含めることができることはわかっています。私は使用しています：

これにより、WebView で右クリックしてインスペクターをアクティブにすることができます。

ボタンやメニュー項目からも Web インスペクターを起動する方法はありますか? これに関するドキュメントが見つかりません。

ありがとう、チャーリー

ノートブックでカスタム css を使用していますが、デフォルトの css を適切に上書きしていないようです。私のコードセルは次のようになります。

それらを実行すると、元の入力形式が含まれているように見えるスペースが下部に追加されます。

これを取り除きたいです。

div.input_areafirefox のインスペクターを使用すると、実行されていない下のセル内の同じ要素と比較すると、要素が拡大されていることがわかります。

拡大された div は、「セットアップ」というタイトルのセクションで薄い青色で強調表示されます。「一部のヘルパー関数の定義」セクションの下にある同じ要素は、正しいサイズです。

拡大したセルをダブルクリックすると、再び正しく表示されます。

要素のサイズが大きくなる原因、div.input_areaまたは原因を見つけるために何ができますか?

編集：

の親にプロパティdiv.input_areaがあることがわかりました。-moz-box-flex: 1これをオフにすると、セルはコンテンツに合わせて水平方向に縮小しますが (これは望ましくありません)、以前に追加した余分なスペースもカバーします。次のようになります。

+ 記号 (新しいスタイル ルール) を使用して通常のスタイル ルールを追加できますが、スタイル インスペクターの "Pseudo ::before Element" または "Pseudo ::after Element" セクションに追加できません。「HTML として編集」で::beforeor要素を HTMLに追加しようとすると、テキストとして出力されます。::after私の回避策は、追加<span class="pseudo_before"></span>してからスタイルを設定することです。何か不足していますか？

Chrome インスペクターが CSS .class パスを生成する方法に問題があります。

クラスのスタイル ルールを追加すると、(たとえば) "body > div.classname" ではなく ".classname" が必要になります。添付の画像を参照してください。

インスペクタのプロパティ パネルに、これを無効にするオプションが見つからないようです。任意のヒント？

Firefox 自体がバージョン 28 (Windows 7 上で実行) に更新されたため、要素検査用の Firebug ショートカットが機能しません ( Ctrl+ Shift+ C)。このキーの組み合わせを押すと、デフォルトの開発者ツール ウィンドウがポップアップします。以前のバージョンの Firefox では、この問題は、Firefox の開発ツールの設定でインスペクター ツールのチェックを外す/無効にするだけで対処できました。ただし、このチェックボックスはなくなりました。

私は次のことを試しました：

• Firefox と Firebug を再インストールしました。
• でabout:configを検索しdevtools.*.enabled、すべての値を に設定しましたfalse。
• Customizable Shortcutsというアドオンをダウンロードしましたが、ショートカットを変更しても問題は解決しませんでした。新しいショートカットが認識されません。
• デフォルトの Firebug Shortcut Bindings ウィンドウでは、ショートカットを変更しても何の影響もありません。同様に、新しいショートカットは認識されません。

使用されていないショートカット (つまり、Ctrl+ Shift+ Alt+ 6) に Firebug インスペクターをバインドしても、まだ認識されません。

Firebug がキーの組み合わせを割り当てることができないか、何か他のことが起こっているようです。

どんな助けでも大歓迎です！

Firefox の Web 開発者用ツールバーには、[情報] の下に、ページに関する地形情報 (何が何の内部にあるのか) を表示するオプションがありました。Chrome の Dev Tools でそれを確認する方法はありますか?

Chrome に Web 開発者用ツールバーをインストールしましたが、ツールバーを有効にする方法が見つかりません。その後、2013 年に Google がツールバーを無効にしているという記事を見つけました。

では、Chrome でどの要素がどの要素の中にあるかを確認する方法はありますか?

Chrome34.0を使用しています。

ありがとう