JavascriptとCSSでマウスオーバーした要素のアウトラインを設定したい。
Chrome では、CSS アウトライン プロパティは適切に機能しますが、Internet Explorer (私は IE9 を使用) では機能しません。
CSS ボーダー プロパティをテストしましたが、実際のコンテンツの幅が狭くなります。
私の目的は、CSS アウトライン プロパティなしでアウトラインを設定することであり、コンテンツの領域は変更されません。
このソリューションは IE 7 ～ 9 をサポートする必要があり、IE6 もサポートしている場合はそれが最適です。
<div>要素を透明な境界線でラップします。マウスオーバーで境界線に色を付けます。
コンテンツの幅が一定量減少することを気にしない場合、つまりマウスオーバー時にコンテンツの幅が変わらない場合は、要素自体に透明な境界線を追加できます (マウスオーバー時に色を付けます)。
CSS ボーダー プロパティをテストしましたが、実際のコンテンツの幅が狭くなります。
はい、レイアウトの残りの部分を調整して、導入する x ピクセルの境界を考慮に入れる必要があります。どこかからスペースを占有します。適切な寸法、余白、およびパディングを設定して補正するのはあなた次第です。