CSS :active ਪਸੀਵਾ

ਪਰਿਭਾਸ਼ਾ ਅਤੇ ਵਰਤੋਂ

CSS :active ਪਸ਼ੂ ਉਪਯੋਗ ਕੀਤੀ ਜਾਂਦੀ ਹੈ ਕਿ ਉਪਯੋਗਕਰਤਾ ਜਿਸ ਅਮਲ ਨੂੰ ਸਰਗਰਮ ਕਰ ਰਿਹਾ ਹੈ ਉਸ ਨੂੰ ਸਟਾਈਲ ਸੈਟ ਕਰੇ。

:active ਪਸ਼ੂ ਦਾ ਸਭ ਤੋਂ ਅਧਿਕ ਵਰਤਾਰਾ <a> ਅਤੇ <button> ਐਲੀਮੈਂਟ ਹੈ। ਜਦੋਂ ਉਪਯੋਗਕਰਤਾ ਲਿੰਕ ਨੂੰ ਕਲਿੱਕ ਕਰਦਾ ਹੈ ਤਾਂ ਲਿੰਕ ਸਰਗਰਮ ਹੋ ਜਾਵੇਗਾ; ਬਟਨ ਵੀ ਅਜਿਹਾ ਹੀ ਹੋਵੇਗਾ。

ਸੁਝਾਅ:ਵਰਤੋਂ :link ਸੰਗਠਿਤ ਪੰਨੇ ਦੇ ਲਿੰਕ ਦੇ ਸਟਾਈਲ ਸੈਟ ਕਰਨ ਲਈ :visited ਸੰਗਠਿਤ ਪੰਨੇ ਦੇ ਲਿੰਕ ਦੇ ਸਟਾਈਲ ਸੈਟ ਕਰਨ ਲਈ :hover ਮਾਉਸ ਉੱਪਰ ਹੋਣ ਵਾਲੇ ਲਿੰਕ ਦੇ ਸਟਾਈਲ ਸੈਟ ਕਰੋ。

ਧਿਆਨ:ਸੀਐੱਸਐੱਸ ਪਰਿਭਾਸ਼ਾਵਾਂ ਵਿੱਚ:active ਮਹੱਤਵਪੂਰਨ ਹੈ ਕਿ ਇਹ :hoverਜੇਕਰ ਮੌਜੂਦ ਹੈ ਤਾਂ ਹੀ ਕੰਮ ਕਰੇਗਾ!

ਮਿਸ਼ਾਲ

ਮਿਸ਼ਾਲ 1

ਸਰਗਰਮ ਲਿੰਕ ਦੇ ਸਟਾਈਲ ਚੋਣ ਅਤੇ ਸੈਟ ਕਰੋ:

a:active {
  background-color: yellow;
}

ਸਵੈ ਸਿਖਾਓ

ਮਿਸ਼ਾਲ 2

ਉਪਯੋਗਕਰਤਾ ਦੇ ਸਰਗਰਮ ਰਾਹੀਂ <button> ਦੇ ਸਟਾਈਲ ਚੋਣ ਅਤੇ ਸੈਟ ਕਰੋ:

button:active {
  background-color: pink;
}

ਸਵੈ ਸਿਖਾਓ

ਮਿਸ਼ਾਲ 3

ਅਸਲ, <h1> ਅਤੇ <a> ਅਮਲ ਹੋਣ ਵਾਲੇ ਪੈਰਾਗ੍ਰਾਫਸ ਦੇ ਸਟਾਈਲ ਚੋਣ ਅਤੇ ਸੈਟ ਕਰੋ:

p:active, h1:active, a:active {
  background-color: yellow;
}

ਸਵੈ ਸਿਖਾਓ

ਮਿਸ਼ਾਲ 4

ਅਸਲ ਲਿੰਕ, ਦੇਖੇ ਗਏ ਲਿੰਕ, ਹੋਵੇਂ ਹੋਈ ਅਤੇ ਸਰਗਰਮ ਲਿੰਕ ਦੇ ਸਟਾਈਲ ਚੋਣ ਅਤੇ ਸੈਟ ਕਰੋ:

/* ਪਹਿਲੀ ਵਾਰ ਦੇਖਿਆ ਗਿਆ ਲਿੰਕ */
a:link {
  color: green;
}
/* ਪਿਛਲੀ ਵਾਰ ਦੇਖਿਆ ਗਿਆ ਲਿੰਕ */
a:visited {
  color: green;
}
/* ਮਾਉਸ ਉੱਪਰ ਹੋਣ ਵਾਲਾ ਲਿੰਕ */
a:hover {
  color: red;
}
/* ਸਰਗਰਮ ਲਿੰਕ */
a:active {
  color: yellow;
}

ਸਵੈ ਸਿਖਾਓ

ਮਿਸ਼ਾਲ 5

ਲਿੰਕ ਲਈ ਵੱਖ-ਵੱਖ ਸਟਾਈਲ ਸੈਟ ਕਰੋ:

a.ex1:hover, a.ex1:active {
  color: red;
}
a.ex2:hover, a.ex2:active {
  font-size: 150%;
}

ਸਵੈ ਸਿਖਾਓ

CSS ਗਰੰਥ

:active {
  css declarations;
}

ਤਕਨੀਕੀ ਵੇਰਵੇ

ਬਰਾਉਜ਼ਰ ਸਮਰਥਨ

ਸਟੇਬਲ ਪ੍ਰਾਪਤ ਕਰਨ ਵਾਲੇ ਪਸ਼ੂ ਦੀ ਪਹਿਲੀ ਬਰਾਉਜ਼ਰ ਸੰਸਕਰਣ ਨੂੰ ਸਟੇਬਲ ਕਰਨ ਵਾਲੇ ਸਫਟਵੇਅਰ ਵਿੱਚ ਗਿਣਤੀ ਹਨ。

ਸਬੰਧਤ ਪੰਨੇ

ਸਿੱਖਿਆਚਾਰਾਂ:CSS ਲਿੰਕ

ਸਿੱਖਿਆਚਾਰਾਂ:CSS ਬਟਨ

ਸਿੱਖਿਆਚਾਰਾਂ:CSS ਪਸ਼ੂ