Cssその他のレベル1

Css：アクティブな例



Css Active Example



NS：アクティブ CSS 疑似クラス ユーザーによってアクティブ化されている要素（ボタンなど）を表します。マウスを使用する場合、「アクティブ化」は通常、ユーザーがマウスの主ボタンを押したときに開始されます。

/* Selects any   that is being activated */ a:active { color: red; }

NS：アクティブ疑似クラスは一般的に使用されます と 要素。この疑似クラスの他の一般的なターゲットには、 含む アクティブ化された要素、および関連付けられた要素を介してアクティブ化されているフォーム要素 。



によって定義されたスタイル：アクティブな疑似クラスは、後続のリンク関連の疑似クラスによって上書きされます（ ：リンク 、 ：ホバー 、 また ：訪問 ）少なくとも同等の特異性を持っています。リンクを適切にスタイル設定するには、：によって定義された、他のすべてのリンク関連ルールの後のアクティブルール LVHA-注文 ：：リンク -：visited —：ホバー—：アクティブ。

ノート： マルチボタンマウスを備えたシステムでは、CSS3は：アクティブな疑似クラスは、プライマリボタンにのみ適用する必要があります。右利きのマウスでは、これは通常、左端のボタンです。

構文

:active

例

HTML

<p>This paragraph contains a link: <a href='#'>This link will turn red while you click on it.a> The paragraph will get a gray background while you click on it or the link. p>

CSS

a:link { color: blue; } /* Unvisited links */ a:visited { color: purple; } /* Visited links */ a:hover { background: yellow; } /* Hovered links */ a:active { color: red; } /* Active links */ p:active { background: #eee; } /* Active paragraphs */

結果



アクティブなフォーム要素

HTML

<form> <label for='my-button'>My button: label> <button id='my-button' type='button'>Try Clicking Me or My Label!button> form>

CSS

form :active { color: red; } form button { background: white; }

結果

仕様

仕様 状態 コメント
HTMLリビングスタンダード
その仕様における「：active」の定義。 		生活水準
セレクターレベル4
その仕様における「：active」の定義。 		ワーキングドラフト 変化なし。
セレクターレベル3
その仕様における「：active」の定義。 		おすすめ 変化なし。
CSSレベル2（リビジョン1）
その仕様における「：active」の定義。 		おすすめ 変化なし。
CSSレベル1
その仕様における「：active」の定義。 		おすすめ 初期定義。

ブラウザの互換性

デスクトップ モバイル
クロム 角 Firefox インターネットエクスプローラ オペラ サファリ WebView Android Chrome Android Android版Firefox Opera Android IOS上のSafari サムスンインターネット
：アクティブ 1 12 1 4 5 1 1 18 4 10.1 1 1.0
non_a_elements 1 12 1 8 7 1 1 18 4 14 1デフォルトでは、iOS上のSafariは ：アクティブ ない限り状態 タッチスタート 関連する要素または上のイベントハンドラ エレメント。 1.0

も参照してください