CSS بوردر انتهای انتهایی-گوشه

تعریف اور استعمال

border-end-end-radius اتارکا استعمال وچ اس کا تعریف کیا گیا ہے کہ ایک عنصر کا بلک کا آخری حصہ (block-end) اور اکائی کا آخری حصہ (inline-end) کے درمیان کا چکرا نکال کا رادیئس کیا ہوگا:

توجہ دیجئے:صرف کئی ایسے ایس-ایس-ای سائٹس کا تعریف writing-mode,text-orientation ਅਤੇ direction بلک سمت اور اکائی سمت کا تعریف کیا گیا ہے، اس لئے یہاتارکا بھی اثرانداز ہوتا ہے: border-end-end-radius اتارکا نتیجہ کا تعریف اکائی کا درجہ سمت چین سے اکائی کا درجہ سمت نیچے سے آتا ہے، بلک میں سمت نیچے سمت سے آتا ہے。

اگر border-end-end-radius اتارکا دو ولو یا اچا نکال دوسرا نکال چکرا اکھنا وچ رہے گا:

border-end-end-radius: 50px 100px;

اگر border-end-end-radius اتارکا اکھن وچ ایک ولو یا اچا نکال چکرا اکھنا وچ رہے گا:

border-end-end-radius: 50px;

CSS border-end-end-radius ਅਟਰੀਬਿਊਟ ਨਾਲ border-bottom-left-radius,border-bottom-right-radius,border-top-left-radius ਅਤੇ border-top-right-radius ਅਟਰੀਬਿਊਟ ਬਹੁਤ ਸਮਾਨ ਹਨ border-end-end-radius ਇਸ ਅਟਰੀਬਿਊਟ ਦਾ ਮੂਲ ਮੁੱਲ ਬਲਾਕ ਦਿਸ਼ਾ ਅਤੇ ਇਨਲਾਈਨ ਦਿਸ਼ਾ ਉੱਤੇ ਨਿਰਭਰ ਕਰਦਾ ਹੈ。

ਇਨਸਟੈਂਸ

ਉਦਾਹਰਣ 1

ਕੁਝ ਐਲੀਮੈਂਟਾਂ ਦੇ ਬਲਾਕ ਦਿਸ਼ਾ ਅਤੇ ਇਨਲਾਈਨ ਦਿਸ਼ਾ ਦੇ ਅੰਤ ਦੇ ਗੋਲਾਕਾਰ ਜੋੜੇ ਨੂੰ ਜੋੜੇ ਜਾਵੇ:

#example1 {
  background-color: lightblue;
  border-end-end-radius: 50px;
}
#example2 {
  background-color: lightblue;
  border-end-end-radius: 50px 20px;
}
#example3 {
  background-color: lightblue;
  border-end-end-radius: 50%;
  direction: rtl;
}
#example4 {
  background-color: lightblue;
  border-end-end-radius: 50%;
  writing-mode: vertical-rl;
} 

ਖੁਦ ਕੋਸ਼ਿਸ਼ ਕਰੋ

ਉਦਾਹਰਣ 2: direction ਅਟਰੀਬਿਊਟ ਦੇ ਸਮੇਕਨ

ਬਲਾਕ ਦਿਸ਼ਾ ਅਤੇ ਇਨਲਾਈਨ ਦਿਸ਼ਾ ਦੇ ਅੰਤ ਦੇ ਗੋਲਾਕਾਰ ਸਥਾਨ ਇਸ ਦੇ ਕਾਰਣ ਪ੍ਰਭਾਵਿਤ ਹੁੰਦੇ ਹਨ。 direction ਅਟਰੀਬਿਊਟ ਦਾ ਪ੍ਰਭਾਵ:

#example1 {
  border: 2px solid red;
  direction: rtl;
  border-end-end-radius: 25px;
}

ਖੁਦ ਕੋਸ਼ਿਸ਼ ਕਰੋ

ਉਦਾਹਰਣ 3: writing-mode ਅਟਰੀਬਿਊਟ ਦੇ ਸਮੇਕਨ

ਬਲਾਕ ਦਿਸ਼ਾ ਅਤੇ ਇਨਲਾਈਨ ਦਿਸ਼ਾ ਦੇ ਅੰਤ ਦੇ ਗੋਲਾਕਾਰ ਸਥਾਨ ਇਸ ਦੇ ਕਾਰਣ ਪ੍ਰਭਾਵਿਤ ਹੁੰਦੇ ਹਨ。 writing-mode ਅਟਰੀਬਿਊਟ ਦਾ ਪ੍ਰਭਾਵ:

#example2 {
  border: 2px solid red;
  writing-mode: vertical-rl;
  border-end-end-radius: 25px;
}

ਖੁਦ ਕੋਸ਼ਿਸ਼ ਕਰੋ

CSS ਗਰੈਮੈਟਿਕਸ

border-end-end-radius: 0|length|initial|inherit;

ਅਟਰੀਬਿਊਟ ਮੁੱਲ

ਤਕਨੀਕੀ ਵੇਰਵੇ

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

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

ਸਬੰਧਤ ਪੰਨੇ

ਸਿੱਖਿਆਬੋਧਕCSS ਗੋਲਾਕਾਰ

ਪਰਾਪਰਕਾਂ ਲਈ:CSS بوردر پایین چپ-گوشه

ਪਰਾਪਰਕਾਂ ਲਈ:CSS بوردر پایین راست-گوشه

ਪਰਾਪਰਕਾਂ ਲਈ:CSS بوردر-ٹاپ-لیف-رائٹ-رادیئس اپریٹر

ਪਰਾਪਰਕਾਂ ਲਈ:CSS بوردر-ٹاپ-رائٹ-رادیئس اپریٹر

ਪਰਾਪਰਕਾਂ ਲਈ:CSS دیکشن پرپرٹی

ਪਰਾਪਰਕਾਂ ਲਈ:CSS ਟੈਕਸਟ-ਓਰੀਐਂਟੇਸ਼ਨ ਪ੍ਰਾਪਰਟੀ

ਪਰਾਪਰਕਾਂ ਲਈ:CSS ਵਰਟਿੰਗ-ਮੋਡ ਪ੍ਰਾਪਰਟੀ