ایچ تی ام ال <details> تیگ

  • ਪਿਛਲਾ ਪੰਨਾ <del>
  • ਅਗਲਾ ਪੰਨਾ <dfn>

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

<details> ਟੈਗ ਨਾਲ ਉਪਭੋਗਤਾ ਦੀ ਇੱਛਾ ਨਾਲ ਖੁੱਲ੍ਹ ਸਕਣ ਜਾਂ ਬੰਦ ਕਰਨ ਵਾਲੇ ਹੋਰ ਵੇਰਵੇ ਨੂੰ ਪਰਿਭਾਸ਼ਿਤ ਕਰਦਾ ਹੈ。

<details> ਟੈਗ ਆਮ ਤੌਰ 'ਤੇ ਇੱਕ ਵਿਵਹਾਰਕ ਛੋਟੇ ਵਿਕਲਪ ਦੇ ਰੂਪ ਵਿੱਚ ਵਰਤਿਆ ਜਾਂਦਾ ਹੈ। ਮੂਲਤਬੀ ਤੌਰ 'ਤੇ ਵਿਕਲਪ ਬੰਦ ਹੁੰਦਾ ਹੈ। ਖੁੱਲ੍ਹੇ ਹੋਣ 'ਤੇ ਇਹ ਵਿਸਤਾਰ ਕਰਦਾ ਹੈ ਅਤੇ ਉਸ ਵਿੱਚ ਦਿਸ਼ਾ ਵਾਲੇ ਸਮੱਗਰੀ ਨੂੰ ਦਿਖਾਉਂਦਾ ਹੈ。

ਕਿਸੇ ਤਰ੍ਹਾਂ ਦਾ ਸਮੱਗਰੀ ਪਾਇਆ ਜਾ ਸਕਦਾ ਹੈ <details> ਟੈਗ ਵਿੱਚ

ਸੁਝਾਅ:<summary> ਟੈਗ ਨਾਲ <details> ਇਸ ਦੇ ਨਾਲ ਵਰਤੋਂ ਕਰਕੇ, ਵੇਰਵੇ ਨੂੰ ਦਿਸ਼ਾ ਵਾਲੇ ਸਿਖਰ ਨੂੰ ਪਰਿਭਾਸ਼ਿਤ ਕਰ ਸਕਦੇ ਹਨ। ਉਪਭੋਗਤਾ ਸਿਖਰ 'ਤੇ ਕਲਿੱਕ ਕਰਨ 'ਤੇ ਇਹ ਦਿਸ਼ਾ ਵਾਲੇ ਸਿਖਰ ਦਿਖਾਇਆ ਜਾਵੇਗਾ <details> ਪਰਿਭਾਸ਼ਿਤ ਕੀਤਾ ਗਿਆ ਸਮੱਗਰੀ。

ਇਸ ਦੇ ਨਾਲ ਦੇਖੋ:

HTML DOM ਸੂਚੀਕਰਣ:Details ਆਬਜੈਕਟ

ਉਦਾਹਰਣ

ਉਦਾਹਰਣ 1

ਵਰਤੋਂ ਕਰਕੇ, ਵੇਰਵੇ ਨੂੰ ਪਰਿਭਾਸ਼ਿਤ ਕਰ ਸਕਦੇ ਹਨ ਜੋ ਕਿ ਉਪਭੋਗਤਾ ਦੀ ਇੱਛਾ ਨਾਲ ਖੁੱਲ੍ਹ ਸਕਦੇ ਹਨ ਜਾਂ ਬੰਦ ਕਰ ਸਕਦੇ ਹਨ:

<details>
  <summary>ਭਵਿੱਖ ਦਾ ਕੇਂਦਰ (Epcot Center)</summary>
  <p>Epcot ਹੈ ਵਾਲਟ ਡਿਜ਼ਨੀ ਵਿਸ਼ਵ ਵਿਆਪਕ ਸੈਰ ਸਥਾਨ ਦਾ ਥੀਮ ਪਾਰਕ, ਜਿਸ ਵਿੱਚ ਹਰਮਨ ਹਰਮਨ ਸਥਾਨ, ਅੰਤਰਰਾਸ਼ਟਰੀ ਪ੍ਰਦਰਸ਼ਨ, ਪੁਰਸਕਾਰ ਵਿਜੇਤਾ ਫਾਇਰਵਰਕ ਅਤੇ ਸੀਜ਼ਨਲ ਗਤੀਵਿਧੀਆਂ ਹਨ。</p>
</details>

ਆਪਣੇ ਅਨੁਭਵ ਕਰੋ

ਉਦਾਹਰਣ 2

CSS ਦੀ ਮਦਦ ਨਾਲ <details> ਅਤੇ <summary> ਦੇ ਸਟਾਈਲ ਸੈਟ ਕਰੋ:

<html>
<style>
details > summary {
  padding: 4px;
  width: 200px;
  background-color: #eeeeee;
  border: none;
  box-shadow: 1px 1px 2px #bbbbbb;
  cursor: pointer;
}
details > p {
  background-color: #eeeeee;
  padding: 4px;
  margin: 0;
  box-shadow: 1px 1px 2px #bbbbbb;
}
</style>
<body>
<details>
  <summary>ਭਵਿੱਖ ਦਾ ਕੇਂਦਰ (Epcot Center)</summary>
  <p>Epcot ਹੈ ਵਾਲਟ ਡਿਜ਼ਨੀ ਵਿਸ਼ਵ ਵਿਆਪਕ ਸੈਰ ਸਥਾਨ ਦਾ ਥੀਮ ਪਾਰਕ, ਜਿਸ ਵਿੱਚ ਹਰਮਨ ਹਰਮਨ ਸਥਾਨ, ਅੰਤਰਰਾਸ਼ਟਰੀ ਪ੍ਰਦਰਸ਼ਨ, ਪੁਰਸਕਾਰ ਵਿਜੇਤਾ ਫਾਇਰਵਰਕ ਅਤੇ ਸੀਜ਼ਨਲ ਗਤੀਵਿਧੀਆਂ ਹਨ。</p>
</details>
</body>
</html>

ਆਪਣੇ ਅਨੁਭਵ ਕਰੋ

ਪ੍ਰਤੀਯੋਗਿਤਾ

ਪ੍ਰਤੀਯੋਗਿਤਾ ਮੁੱਲ ਵਰਣਨ
open open ਵਿਵਰਣ ਨੂੰ ਉਪਭੋਗਤਾ ਨੂੰ ਦਿਸਾਈ ਜਾਣਾ ਚਾਹੀਦਾ ਹੈ (ਖੁੱਲ੍ਹਿਆ ਹੋਵੇ)

ਗਲੋਬਲ ਪ੍ਰਤੀਯੋਗਿਤਾ

<details> ਟੈਗ ਇਸ ਵੀ ਪ੍ਰਤੀਯੋਗਿਤਾ ਦਾ ਸਮਰਥਨ ਕਰਦੇ ਹਨ HTML ਵਿੱਚ ਗਲੋਬਲ ਪ੍ਰਤੀਯੋਗਿਤਾ。

ਈਵੈਂਟ ਪ੍ਰਤੀਯੋਗਿਤਾ

<details> ਟੈਗ ਇਸ ਵੀ ਪ੍ਰਤੀਯੋਗਿਤਾ ਦਾ ਸਮਰਥਨ ਕਰਦੇ ਹਨ HTML ਵਿੱਚ ਈਵੈਂਟ ਪ੍ਰਤੀਯੋਗਿਤਾ。

ਮੂਲਤਬੀ ਸੀਐੱਸਐੱਸ ਸੈਟਿੰਗ

ਮੋਸਟ ਬਰਾਉਜ਼ਰਜ਼ ਨਾਲ ਹੇਠ ਲਿਖੇ ਮੂਲਤਬੀ ਮੁੱਲ ਵਰਤਦੇ ਹਨ <details> ਐਲੀਮੈਂਟ:

details {
  display: block;
}

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

ਸਾਰੇ ਨੰਬਰ ਵਿੱਚ ਪਹਿਲੀ ਵਾਰ ਇਸ ਇਲੈਕਟ੍ਰੌਨ ਨੂੰ ਸਮਰਥਨ ਕਰਨ ਵਾਲੇ ਬਰਾਉਜ਼ਰ ਦੀ ਆਖਰੀ ਸੰਸਕਰਣ ਦਿਸਾਈ ਹੋਈ ਹੈ。

ਚਰਾਮ ਐਂਜਲ ਫਾਇਰਫਾਕਸ ਸੈਫਾਰੀ ਓਪੇਰਾ
ਚਰਾਮ ਐਂਜਲ ਫਾਇਰਫਾਕਸ ਸੈਫਾਰੀ ਓਪੇਰਾ
12.0 79.0 49.0 6.0 15.0
  • ਪਿਛਲਾ ਪੰਨਾ <del>
  • ਅਗਲਾ ਪੰਨਾ <dfn>