CSS بوردر-ایمج-کشش اتریب

ਵਿਆਖਿਆ ਅਤੇ ਵਰਤੋਂ

border-image-slice ਵਿਸ਼ੇਸ਼ਤਾ ਚਿੱਤਰ ਬਰੂਜ਼ ਦੇ ਅੰਦਰੂਨੀ ਸਥਾਨਾਂ ਨੂੰ ਨਿਰਦੇਸ਼ ਕਰਦੀ ਹੈ。

ਹੋਰ ਦੇਖੋ:

CSS3 ਸਿੱਖਿਆਬੋਧਨ:CSS3 ਬਰਾਂਡ

ਉਦਾਹਰਣ

ਚਿੱਤਰ ਬਰੂਜ਼ ਦੇ ਅੰਦਰੂਨੀ ਸਥਾਨਾਂ ਨੂੰ ਨਿਰਦੇਸ਼ ਕਰਦਾ ਹੈ:

div
{
border-image-source: url(border.png);
border-image-slice: 50% 50%;
}

CSS ਗਰੁੱਪਰਾਸ਼ਟਰਾਂ

border-image-slice: number|%|fill;

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

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

ਮੁੱਲ ਵਰਣਨ
number ਨੰਬਰ ਮੁੱਲ, ਚਿੱਤਰ ਵਿੱਚ ਪਿਕਸਲ (ਅਗਰ ਰੇਸਟ੍ਰੀਓ ਚਿੱਤਰ ਹੈ) ਜਾਂ ਵੈਕਟਰ ਨਿਰਦੇਸ਼ਾਂ (ਅਗਰ ਵੈਕਟਰ ਚਿੱਤਰ ਹੈ) ਦੇ ਪ੍ਰਤੀਸ਼ਤ ਮੁੱਲ ਹੁੰਦਾ ਹੈ。
% ਚਿੱਤਰ ਦੇ ਪੈਮਾਨੇ ਦੇ ਪ੍ਰਤੀਸ਼ਤ ਮੁੱਲ: ਚਿੱਤਰ ਦੀ ਚੌੜਾਈ ਪੱਧਰੀ ਸਥਾਨਾਂ ਨੂੰ ਪ੍ਰਭਾਵਿਤ ਕਰਦੀ ਹੈ, ਉੱਚਾਈ ਪੱਧਰੀ ਸਥਾਨਾਂ ਨੂੰ ਪ੍ਰਭਾਵਿਤ ਕਰਦੀ ਹੈ。
fill ਬਾਹਰੀ ਬਰੂਜ਼ ਚਿੱਤਰ ਦੇ ਮੱਧ ਭਾਗ ਨੂੰ ਰੱਖੇ ਰਹੇ।

ਤਕਨੀਕੀ ਵੇਰਵੇ

ਮੂਲ ਮੁੱਲ: 100%
ਵਿਰਾਸਤੀਤਾ: no
ਵਰਜਨ: CSS3
JavaScript ਗਰੁੱਪਰਾਸ਼ਟਰਾਂ: object.style.borderImageSlice="50% 50%"

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

ਸਾਰੇ ਪੰਨੇ ਵਿੱਚ ਸਬੰਧਤ ਵਿਸ਼ੇਸ਼ਤਾ ਲਈ ਪੂਰੀ ਤਰ੍ਹਾਂ ਸਮਰਥਨ ਵਾਲੇ ਪਹਿਲੇ ਬਰਾਉਜ਼ਰ ਵਰਜਨ ਦੇ ਨੰਬਰ ਦਿਸ਼ਾ-ਨਿਰਦੇਸ਼ ਕਰਦੇ ਹਨ。

ਚਰਮੋਨਾ IE / ਐਂਜਲ ਫਾਇਰਫਾਕਸ ਸਫਾਰੀ ਓਪੇਰਾ
15.0 11.0 15.0 6.0 15.0

ਦੇਖੋ border-image ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ。