CSS break-inside ਪ੍ਰਤੀਯੋਗਿਤਾ

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

break-inside ਵਿਸ਼ੇਸ਼ਤਾ ਨੇ ਨਿਰਧਾਰਿਤ ਏਜੈਂਟ ਅੰਦਰ ਪੰਨੀਕਰਨ (page-break), ਸਤੰਭਾਂ ਦੀ ਹਰਾਕਤ (column-break) ਜਾਂ ਖੇਤਰਾਂ ਦੀ ਹਰਾਕਤ (region-break) ਵਿੱਚ ਸਮਰਥਨ ਦਿੰਦੀ ਹੈ。

break-inside ਵਿਸ਼ੇਸ਼ਤਾ ਨੇ CSS2 ਦੀ page-break-inside ਵਿਸ਼ੇਸ਼ਤਾ ਨੂੰ ਵਧਾਇਆ ਹੈ。

break-inside ਦੀ ਵਰਤੋਂ ਨਾਲ ਤੁਸੀਂ ਬਰਾਉਜ਼ਰ ਨੂੰ ਸੂਚਿਤ ਕਰ ਸਕਦੇ ਹੋ ਕਿ ਚਿੱਤਰ, ਕੋਡ ਸ਼ੈਕਟ, ਤੇਲਕਬੋਰਡ ਅਤੇ ਸੂਚੀਆਂ ਵਿੱਚ ਹਰਾਕਤ ਤੋਂ ਬਚੋ।

ਉਦਾਹਰਣ

avoid-break-inside <img> ਏਜੈਂਟ ਵਿੱਚ:

@media print {
  img {
    display: block;
    break-inside: avoid;
  }
}

CSS ਸਿਧਾਂਤ

break-inside: auto|all|always|avoid|avoid-column|avoid-page|avoid-region|column|left|page|recto|region|right|verso|initial|inherit;

ਵਿਸ਼ੇਸ਼ਤਾ ਮੁੱਲ

ਮੁੱਲ ਵਰਣਨ
auto ਮੂਲ ਮੁੱਲ। ਏਜੈਂਟ ਅੰਦਰ ਸਵੈਚਾਲਿਤ ਪੰਨੀਕਰਨ, ਸਤੰਭਾਂ ਦੀ ਹਰਾਕਤ ਅਤੇ ਖੇਤਰਾਂ ਦੀ ਹਰਾਕਤ ਕਰੇ。
avoid avoid-break-inside
avoid-column avoid-break-inside
avoid-page avoid-break-inside
avoid-region avoid-break-inside
initial ਇਸ ਵਿਸ਼ੇਸ਼ਤਾ ਨੂੰ ਉਸ ਦੇ ਮੂਲ ਮੁੱਲ 'ਤੇ ਸੈਟ ਕਰੋ। ਦੇਖੋ: initial
inherit ਆਪਣੇ ਮਾਪੇ ਏਜੈਂਟ ਤੋਂ ਇਸ ਵਿਸ਼ੇਸ਼ਤਾ ਲੈ ਲਓ। ਦੇਖੋ: inherit

ਤਕਨੀਕੀ ਵੇਰਵੇ

ਮੂਲ ਮੁੱਲ: auto
ਵਿਰਾਸਤ: ਨਹੀਂ
ਐਨੀਮੇਸ਼ਨ ਬਣਾਉਣਾ: ਸਮਰਥਨ ਨਹੀਂ ਹੈ। ਦੇਖੋ:ਐਨੀਮੇਸ਼ਨ ਸਬੰਧੀ ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ
ਵਰਜਨ CSS3
JavaScript ਸਿਧਾਂਤ object.style.breakInside="always"

ਹੋਰ ਉਦਾਹਰਣ

avoid-break-inside <table>, <ul>, <ol> ਏਜੈਂਟਾਂ ਵਿੱਚ:

@media print {
  table, ul, ol {
    break-inside: avoid;
  }
}

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

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

ਚਰਮੀ IE / ਐਂਜਲ ਫਾਇਰਫਾਕਸ ਸਫਾਰੀ ਓਪਰਾ
50.0 10.0 65.0 10.0 37.0