CSS استعمال کاربر

CSS استعمال کاربر

ਇਸ ਚਾਪ 'ਚ, ਤੁਸੀਂ ਹੇਠ ਲਿਖੇ CSS ਯੂਜ਼ਰ ਇੰਟਰਫੇਸ ਪ੍ਰਤੀਯੋਗਿਤਾਵਾਂ ਨੂੰ ਸਿੱਖੋਗੇ:

  • resize
  • outline-offset

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

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

属性 ਚਰਮ ਆਈਈ ਫਾਇਰਫਾਕਸ ਸਫਾਰੀ ਓਪਰਾ
resize 4.0 ਸਮਰੱਥ ਨਹੀਂ 5.0 4.0 15.0
outline-offset 4.0 15.0 5.0 4.0 9.5

CSS ਸਮਾਯੋਜਨ

resize ਪ੍ਰਤੀਯੋਗਿਤਾ ਦੇ ਦਾਇਰੇ ਵਿੱਚ ਏਜੰਟ ਨੂੰ ਯੂਜ਼ਰ ਦੁਆਰਾ ਸਮਾਯੋਜਿਤ ਕਰਨ ਦੀ ਆਗਿਆ ਦੇਣ ਨੂੰ ਨਿਰਧਾਰਿਤ ਕਰਦਾ ਹੈ (ਅਤੇ ਕਿਵੇਂ):

ਇਹ div ਏਜੰਟ ਦਾ ਸਮਾਯੋਜਨ ਕੀਤਾ ਜਾ ਸਕਦਾ ਹੈ!

ਸਮਾਯੋਜਨ: ਇਸ div ਏਜੰਟ ਦੇ ਹੱਥ ਨਾਲ ਹੱਥ ਕਰਕੇ ਖੇਡੋ।

ਧਿਆਨ:ਇੰਟਰਨੈੱਟ ਈਕਸਪਲੋਰਰ ਵਿੱਚ resize ਪ੍ਰਤੀਯੋਗਿਤਾ ਨਹੀਂ ਸਮਰੱਥ ਹੈ。

ਹੇਠ ਦੇ ਉਦਾਹਰਣ ਵਿੱਚ <div> ਏਜੰਟ ਦੀ ਚੌਡਾਈ ਸਮਾਯੋਜਿਤ ਕਰਨ ਦੀ ਆਗਿਆ ਦਿੱਤੀ ਗਈ ਹੈ:

ਉਦਾਹਰਣ

div {
  resize: horizontal;
  overflow: auto;
}

亲自试一试

ਹੇਠ ਦੇ ਉਦਾਹਰਣ ਵਿੱਚ <div> ਏਜੰਟ ਦੀ ਉਚਾਈ ਸਮਾਯੋਜਿਤ ਕਰਨ ਦੀ ਆਗਿਆ ਦਿੱਤੀ ਗਈ ਹੈ:

ਉਦਾਹਰਣ

div {
  resize: vertical;
  overflow: auto;
}

亲自试一试

ਹੇਠ ਦੇ ਉਦਾਹਰਣ ਵਿੱਚ <div> ਏਜੰਟ ਦੀ ਉਚਾਈ ਅਤੇ ਚੌਡਾਈ ਸਮਾਯੋਜਿਤ ਕਰਨ ਦੀ ਆਗਿਆ ਦਿੱਤੀ ਗਈ ਹੈ:

ਉਦਾਹਰਣ

div {
  resize: both;
  overflow: auto;
}

亲自试一试

ਕਈ ਬਰਾਉਜ਼ਰਾਂ ਵਿੱਚ <textarea> ਮੂਲਤਬੀ ਤੌਰ 'ਤੇ ਸਮਾਯੋਜਿਤ ਹੁੰਦਾ ਹੈ। ਇੱਥੇ, ਅਸੀਂ resize ਪ੍ਰਤੀਯੋਗਿਤਾ ਦੀ ਮੰਗ ਨੂੰ ਨਾ ਹੋਣ ਦੇ ਤੌਰ 'ਤੇ ਕਾਰਜ ਕਰਦੇ ਹਾਂ:

ਉਦਾਹਰਣ

textarea {
  resize: none;
}

亲自试一试

CSS ਕਿਰਦ ਸ਼ਿਫਟ

outline-offset ਪ੍ਰਤੀਯੋਗਿਤਾ ਕਿਨਾਰੇ ਅਤੇ ਏਜੰਟ ਦੀ ਕਿਨਾਰੇ ਬਾਹਰ ਥਾਂ ਜੋੜਦੀ ਹੈ。

ਇਹ div 15px ਦੀ ਕਿਨਾਰਾ ਕਿਨਾਰੇ ਤੋਂ ਬਾਹਰ ਹੈ。

ਧਿਆਨ:ਕਿਨਾਰਾ ਅਤੇ ਕਿਨਾਰਾ ਵਿੱਚ ਅਲੱਗ ਹਨ! ਕਿਨਾਰੇ ਤੋਂ ਅਲੱਗ, ਕਿਨਾਰਾ ਰੇਖਾ ਏਜੰਟ ਕਿਨਾਰੇ ਤੋਂ ਬਾਹਰ ਦਰਸਾਈ ਗਈ ਹੈ ਅਤੇ ਹੋਰ ਸਮੱਗਰੀ ਨਾਲ ਟਾਲੀ ਹੋ ਸਕਦੀ ਹੈ। ਸਾਥ ਹੀ, ਕਿਨਾਰਾ ਵੀ ਏਜੰਟ ਦੀ ਕੰਮ ਦੀ ਹਿੱਸੇਦਾਰੀ ਨਹੀਂ ਹੈ: ਏਜੰਟ ਦੀ ਕੁੱਲ ਚੌਡਾਈ ਅਤੇ ਉਚਾਈ ਕਿਨਾਰਾ ਰੇਖਾ ਚੌਡਾਈ ਦੇ ਪ੍ਰਭਾਵ ਤੋਂ ਬਿਨਾ ਬਦਲ ਸਕਦੀ ਹੈ।

ਹੇਠ ਦੇ ਉਦਾਹਰਣ ਵਿੱਚ outline-offset ਪ੍ਰਤੀਯੋਗਿਤਾ ਵਿੱਚ ਬਾਰੰਬਾਰ ਅਤੇ ਕਿਨਾਰੇ ਦਰਮਿਆਨ ਥਾਂ ਜੋੜਿਆ ਗਿਆ ਹੈ:

ਉਦਾਹਰਣ

div.ex1 {
  margin: 20px;
  border: 1px solid black;
  outline: 4px solid red;
  outline-offset: 15px;
} 
div.ex2 {
  margin: 10px;
  border: 1px solid black;
  outline: 5px dashed blue;
  outline-offset: 5px;
}

亲自试一试

CSS 用户界面属性

下表列出了所有用户界面属性：

属性 描述
outline-offset 在轮廓和元素的边框边缘之间添加空间。
resize عنصر کو استعمال کاربر کی جانب سے سائز کرسکتا ہے یا نہیں کا معلوم کرسکتا ہے。