CSS بوردر بلوک سبک پراپٹری

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

border-block-style ਪ੍ਰਤੀਭਾਗ ਨੂੰ ਬਲਾਕ ਦਿਸ਼ਾ ਵਿੱਚ ਏਜੰਟ ਦੇ ਕੰਧ ਸਟਾਈਲ ਸੈਟ ਕਰਦਾ ਹੈ。

border-block-style ਪ੍ਰਤੀਭਾਗ ਦਾ ਮੁੱਲ ਵੱਖ-ਵੱਖ ਤਰੀਕਿਆਂ ਨਾਲ ਸੈਟ ਕੀਤਾ ਜਾ ਸਕਦਾ ਹੈ:

ਜੇਕਰ border-block-style ਪ੍ਰਤੀਭਾਗ ਦੋ ਮੁੱਲ ਹਨ:

border-block-style: dashed dotted;
  • ਬਲਾਕ ਸ਼ੁਰੂ ਦੇ ਕੰਧ ਸਟਾਈਲ ਹਰੇਕ ਪਾਸੇ ਲਾਈਨ
  • ਬਲਾਕ ਸਮਾਪਤ ਦੇ ਕੰਧ ਸਟਾਈਲ ਪੁਆਇੰਟਲਾਈਨ ਹੈ

ਜੇਕਰ border-block-style ਪ੍ਰਤੀਭਾਗ ਇੱਕ ਮੁੱਲ ਹੈ:

border-block-style: dashed;
  • ਬਲਾਕ ਸ਼ੁਰੂ ਅਤੇ ਸਮਾਪਤ ਦੇ ਕੰਧ ਸਟਾਈਲ ਹਰੇਕ ਪਾਸੇ ਲਾਈਨ

CSS border-block-style 属性与 CSS 属性 border-bottom-styleborder-left-styleborder-right-style ਅਤੇ border-top-style 非常相似,但 border-block-style ਬਹੁਤ ਹੀ ਮਿਲਦਾ ਹੈ, ਪਰ}}

ਗੁਣ ਬਲੌਕ ਦਿਸ਼ਾ 'ਤੇ ਨਿਰਭਰ ਕਰਦਾ ਹੈ。ਧਿਆਨ: writing-mode ਬਲੌਕ ਦਿਸ਼ਾ ਨੂੰ ਨਿਰਧਾਰਿਤ ਕਰਦਾ ਹੈ। ਇਹ ਬਲੌਕ ਦੇ ਸ਼ੁਰੂ ਅਤੇ ਸਮਾਪਤ ਸਥਾਨ ਅਤੇ ਸਬੰਧਤ CSS ਗੁਣਾਂ 'ਤੇ ਪ੍ਰਭਾਵ ਪਾਉਂਦਾ ਹੈ。 border-block-style ਗੁਣ ਦਾ ਨਤੀਜਾ। ਇੰਗਲਿਸ਼ ਪੇਜ਼ਾਂ ਵਿੱਚ ਲਾਈਨ ਦਿਸ਼ਾ ਵੱਲੋਂ ਸੱਜੇ ਤੋਂ ਖੱਬੇ ਹੁੰਦੀ ਹੈ, ਬਲੌਕ ਦਿਸ਼ਾ ਵੱਲੋਂ ਹੇਠਾਂ ਹੁੰਦੀ ਹੈ。

ਇਨਸਟੈਂਸ

ਉਦਾਹਰਣ 1

ਬਲੌਕ ਦਿਸ਼ਾ 'ਤੇ ਬੋਰਡਰ ਸਟਾਈਲ ਸੈਟ ਕਰੋ:

#example1 {
  border-block-style: solid;
}
#example2 {
  border-block-style: dashed dotted;
}

ਆਪਣੇ ਅਨੁਭਵ ਲਈ ਪ੍ਰਯੋਗ ਕਰੋ

ਉਦਾਹਰਣ 2: writing-mode ਗੁਣ ਦੇ ਸਮੇਤ

ਬਲੌਕ ਦਿਸ਼ਾ ਦੇ ਸ਼ੁਰੂ ਅਤੇ ਸਮਾਪਤ ਸਥਾਨ ਦੇ ਬੋਰਡਰ ਸਟਾਈਲ ਦਾ ਸਥਾਨ ਬਲੌਕ ਦਿਸ਼ਾ ਤੋਂ ਪ੍ਰਭਾਵਿਤ ਹੁੰਦਾ ਹੈ。 writing-mode ਗੁਣ ਦੇ ਪ੍ਰਭਾਵ:

div {
  writing-mode: vertical-rl;
  border-block-style: dotted;
}

ਆਪਣੇ ਅਨੁਭਵ ਲਈ ਪ੍ਰਯੋਗ ਕਰੋ

CSS ਗਰਿੱਖਿਆ

border-block-style: none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset|initial|inherit;

ਗੁਣ ਮੁੱਲ

ਮੁੱਲ ਵਰਣਨ
none ਮੂਲ ਮੁੱਲ। ਬੋਰਡਰ ਨਾ ਹੋਣ ਨੂੰ ਸੈਟ ਕਰੋ。
hidden none ਨਾਲ ਮਿਲਦਾ ਹੈ, ਪਰ ਟੇਬਲ ਅਕਾਰਜ਼ਮਾਨ ਦੇ ਬੋਰਡਰ ਟਕਰਾਅ ਨਿਪਟਾਉਣ ਦੇ ਸਮੇਂ ਛੱਡੋ।
dotted ਨਾਨਾ ਬੋਰਡਰ ਦੇਣਾ。
dashed ਹੱਲ੍ਹੇਦਾਰ ਬੋਰਡਰ ਦੇਣਾ。
solid ਸਿੱਧੀ ਬੋਰਡਰ ਦੇਣਾ。
double ਦੁਗਣੀ ਬੋਰਡਰ ਦੇਣਾ。
groove

3D ਅੰਦਰ ਖੁੱਟੇ ਬੋਰਡਰ ਦੇਣਾ。

ਪ੍ਰਭਾਵ ਬੋਰਡਰ-ਕਲਰ ਦੇ ਮੁੱਲ 'ਤੇ ਨਿਰਭਰ ਕਰਦਾ ਹੈ。

ridge

3D ਬਾਹਰ ਖੁੱਟੇ ਬੋਰਡਰ ਦੇਣਾ。

ਪ੍ਰਭਾਵ ਬੋਰਡਰ-ਕਲਰ ਦੇ ਮੁੱਲ 'ਤੇ ਨਿਰਭਰ ਕਰਦਾ ਹੈ。

inset

3D ਅੰਦਰ ਖੁੱਟੇ ਬੋਰਡਰ ਦੇਣਾ。

ਪ੍ਰਭਾਵ ਬੋਰਡਰ-ਕਲਰ ਦੇ ਮੁੱਲ 'ਤੇ ਨਿਰਭਰ ਕਰਦਾ ਹੈ。

outset

3D ਬਾਹਰ ਖੁੱਟੇ ਬੋਰਡਰ ਦੇਣਾ。

ਪ੍ਰਭਾਵ ਬੋਰਡਰ-ਕਲਰ ਦੇ ਮੁੱਲ 'ਤੇ ਨਿਰਭਰ ਕਰਦਾ ਹੈ。

initial ਇਸ ਗੁਣ ਨੂੰ ਉਸ ਦੇ ਮੂਲ ਮੁੱਲ ਨੂੰ ਸੈਟ ਕਰੋ। ਦੇਖੋ: initial.
inherit ਇਸ ਗੁਣ ਨੂੰ ਉਸ ਦੇ ਮਾਤਾ ਅਕਾਰਜ਼ਮਾਨ ਤੋਂ ਵਿਰਾਸਤ ਕਰੋ। ਦੇਖੋ: inherit.

ਤਕਨੀਕੀ ਵੇਰਵੇ

ਮੂਲ ਮੁੱਲ: none
ਵਿਰਾਸਤੀਤਾ: ਨਹੀਂ
ਐਨੀਮੇਸ਼ਨ ਬਣਾਉਣਾ: ਸਮਰੱਥ ਨਹੀਂ ਹੈ। ਦੇਖੋ:ਐਨੀਮੇਸ਼ਨ ਸਬੰਧਤ ਗੁਣ.
ਵਰਜਨ: CSS3
ਜਾਵਾਸਕ੍ਰਿਪਟ ਗਰਿੱਖਿਆ: object.style.borderBlockStyle="dotted"

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

ਸਾਰੇ ਸਾਰੇ ਅਕਾਰਜ਼ਮਾਨ ਦੀਆਂ ਸਬੰਧਤ ਵਰਜਨਾਂ ਦੇ ਸਬੰਧ ਵਿੱਚ ਪਹਿਲੀ ਵਾਰ ਇਸ ਗੁਣ ਦੀ ਪੂਰੀ ਤਰ੍ਹਾਂ ਸਮਰੱਥ ਬਰਾਊਜ਼ਰ ਦੀ ਵਰਜਨਾ ਨੂੰ ਸ਼ਾਮਲ ਕੀਤਾ ਗਿਆ ਹੈ。

ਚਰਾਮੇ ਐਂਜਲ ਫਾਇਰਫਾਕਸ ਸਫਾਰੀ ਓਪੇਰਾ
87.0 87.0 66.0 14.1 73.0

ਸਬੰਧਤ ਪੇਜ਼

ਸਿਖਲਾਈਕਾਰਜ਼ਮਾਨCSS ਬੰਦਰ

ਸਲਾਹਦਾਰੀ:CSS بوردر پراپٹری

ਸਲਾਹਦਾਰੀ:CSS بوردر بلوک پراپٹری

ਸਲਾਹਦਾਰੀ:CSS بوردر بلوک ختم سبک پراپٹری

ਸਲਾਹਦਾਰੀ:CSS بوردر بلوک شروع سبک پراپٹری

ਸਲਾਹਦਾਰੀ:CSS بوردر بوتوم سبک پراپٹری

ਸਲਾਹਦਾਰੀ:CSS border-left-style پیوسیتی

ਸਲਾਹਦਾਰੀ:CSS border-right-style پیوسیتی

ਸਲਾਹਦਾਰੀ:CSS border-top-style پیوسیتی

ਸਲਾਹਦਾਰੀ:CSS writing-mode ਪ੍ਰਤੀਯੋਗਿਤਾ