参照：Chromeデベロッパーツールのホバー状態
Chromeでホバリングしているアンカーの:hoverスタイルを見たいのですが。 Firebugには、要素に対してさまざまな状態を選択できるスタイルドロップダウンがあります。 Chromeに似たようなものが見つからないようです。私は何かが足りないのですか？
これで、疑似クラスの規則の両方を見て、それらを要素に強制することができます。
[スタイル]ペインに:hoverのような規則を表示するには、右上の小さい:hovというテキストをクリックします。
要素を強制的に:hover状態にするには、それを右クリックします。
要素パネル in Chromeデベロッパーツールのショートカット に関するその他のヒント。
編集：この答えはバグ修正の前でした、tnothcuttの答えを見てください。
- 要素を右クリックしても、マウスポインタを要素から離してホバー状態にしないでください。
- 矢印キーを押してからEnterキーを押すように、キーボードで[要素の検査]を選択します。
- Matched CSS Rulesの下の開発者ツールを見てください。
PS：私はあなたの質問タグの一つでこれを試した。
Bootstrapツールチップでホバー状態を確認したいと思いました。 Chrome開発ツールでthe：hover状態を強制しても必要な出力が作成されませんでしたが、コンソールでmouseenterイベントをトリガーしてもChromeでうまくいきませんでした。ページにjQueryが存在する場合は、実行できます。
$('.YOUR-TOOL-TIP-CLASS').trigger('mouseenter');
Chromeデベロッパーツールで HOVER STATE スタイルを確認する方法はいくつかあります。
方法01
方法02
Firefoxのデフォルト開発者通話料を使って
Firebug付き
それが役立つ場合には、これは最新のChrome（47.0.2526.106）の方が簡単なようです。
要素を調べてから、左のガターの3つの白い点をクリックします。
次に、このドロップダウンから必要な要素の状態を選択します。
これを行う方法があるとは思わない。機能要求を送信しました。解決策がある場合は、Googleの開発者がそれを指摘し、回答を編集します。そうでなければ、我々は待って見なければならないでしょう。 （あなたはそれに投票するために問題にスターを付けることができます）
Chromeプロジェクトメンバーのコメント1 ：10.0.620.0では、スタイルパネルに選択した要素の：ホバースタイルが表示されますが、：アクティブは表示されません。
（この記事の時点で）現在の 安定したチャンネル バージョンは8.0.552.224です。
安定版チャンネル / Google Chromeのインストール版を ベータ版チャンネル または Devチャンネル に置き換えることができます（ 早期アクセスリリースチャンネル を参照）。
Devチャンネルよりもさらに最新のクロムの セカンダリインストールをインストールすることもできます 。
... CanaryビルドはDevチャンネルよりもさらに頻繁に更新され、リリースされる前にテストされません。 Canaryビルドは時々使用できなくなる可能性があるため、デフォルトのブラウザとして設定することはできず、Google Chromeの上記のチャネルのいずれかに加えてインストールされることがあります。 ...
私は自分のしていることはかなりの回避策であることを知っていますが、それは完璧に機能し、それが私が毎回行う方法です。
その後、次のように進めます。
- まずChromeデベロッパーツールがドッキングされていないことを確認してください。
- 次に、[Dev Tools]ウィンドウのいずれかの側を、ホバーしている間に調べたい要素の中央に移動します。
- 最後に、要素にカーソルを合わせ、右クリックして要素を確認し、マウスを開発ツールウィンドウに移動すると、要素で遊ぶことができます。hover css。
乾杯！
私はChromeでmenu hover状態をデバッグしていて、ホバー状態コードを見ることができるようにこれをしました：
ElementsパネルでToggle Element stateボタンをクリックして:hoverを選択してください。
Scriptsパネルで右下のセクションのEvent Listeners Breakpointsに行き、Mouse -> mouseupを選択してください。
今すぐメニューを調べて、必要なボックスを選択します。マウスボタンを離すと、ボタンが停止し、選択した要素のホバー状態がElementsパネルに表示されます（Stylesセクションを参照）。
私の場合は、ブートストラップツールチップをダビングしたいと思います。しかし、上記の方法は私にはうまくいきません。私はブートストラップがマウスイン/アウトイベントのようなものによってこれを実装したと思います。
とにかく、ボタンの上にカーソルを置くと、ボタンの下に兄弟HTML要素が生成されるので、[開発者ツール]ウィンドウの[要素]タブでボタンの親要素を選択し、ボタンを押しながら[Ctrl + C]それから私は生成されたコードを含むソースコードを貼り付けることができます。最後に、生成されたコードを見つけて、[要素]タブの[HTMLとして編集]でソースコードに追加します。
誰かに役立つことを願っています。
Babikerが提案している以下のステップに従ってスタイルを見ることができた - "右クリック要素、しかし要素からマウスポインタを動かしてはいけない。ホバー状態のままにしてください。キーを入力してください。」
スタイルを変更するには、上記の手順に従ってください。 - キーボードのCtrl + Tabキーを押してブラウザのタブを変更します。次にデバッグしたいタブをクリックします。あなたのホバー画面はまだそこにあります。今慎重にあなたのマウスを開発者ツール領域に持って行きなさい。
Chromeで hover statusに変更するのはとても簡単です。下記の手順に従ってください。
1） ページ内で右クリック して検査を選択
2） _ dom _ で調べたい要素を選択します
3）ピンアイコンを選択してください 
（要素状態の切り替え）
4）それから ホバー にチェックを入れます
これで、選択した _ dom _ のホバー状態がブラウザに表示されます。
これはChromeではもはや問題ではなく念のためです。 TABキーで動き回るときにDOMを調べるために、このjQuery script を書きました。
'mouseover'を使うように変更すると、このようになります。
$("body *").on('mouseover', function(event) {
console.log(event.target);
inspect(event.target);
event.stopPropagation();
});
クリックしたときや停止したい要素上で何かをしたときにイベントハンドラを削除するように簡単に変更できます。