CSS بوردر چپ چپ شروع دائرہ اپریٹ

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

border-end-start-radius ਵਿਸ਼ੇਸ਼ਤਾ ਦੀ ਵਰਤੋਂ ਨਾਲ ਬਲਕ ਦਿਸ਼ਾ ਦੇ ਅੰਤ ਅਤੇ ਲਿਖਣ ਦੀ ਦਿਸ਼ਾ ਦੇ ਸ਼ੁਰੂ ਵਿੱਚ ਗੋਲਾਕਾਰ ਦੀ ਦੂਰੀ ਨੂੰ ਪਰਿਭਾਸ਼ਿਤ ਕਰਦੀ ਹੈ。

ਧਿਆਨ:ਸਬੰਧਤ CSS ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ writing-mode,text-orientation ਅਤੇ direction ਬਲਕ ਦਿਸ਼ਾ ਅਤੇ ਲਿਖਣ ਦੀ ਦਿਸ਼ਾ ਨੂੰ ਪਰਿਭਾਸ਼ਿਤ ਕਰਦੀ ਹੈ। ਇਸ ਲਈ ਇਹ ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ ਵੀ ਪ੍ਰਭਾਵਿਤ ਕਰਦੀਆਂ ਹਨ: border-end-start-radius ਵਿਸ਼ੇਸ਼ਤਾ ਦਾ ਨਤੀਜਾ। ਇੰਗਲਿਸ਼ ਪੰਨਿਆਂ ਵਿੱਚ ਲਿਖਣ ਦੀ ਦਿਸ਼ਾ ਖੱਬੇ ਤੋਂ ਸੱਜੇ ਹੁੰਦੀ ਹੈ ਅਤੇ ਬਲਕ ਦਿਸ਼ਾ ਹੇਠਾਂ ਹੁੰਦੀ ਹੈ。

ਜੇਕਰ border-end-start-radius ਜੇਕਰ ਵਿਸ਼ੇਸ਼ਤਾ ਦੀਆਂ ਦੋ ਕੀਮਤਾਂ ਹਨ ਤਾਂ ਗੋਲਾਕਾਰ ਹੋਵੇਗਾ:

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

ਜੇਕਰ border-end-start-radius ਜੇਕਰ ਵਿਸ਼ੇਸ਼ਤਾ ਦੀ ਕੀਮਤ ਹੈ ਤਾਂ ਗੋਲਾਕਾਰ ਹੋਵੇਗਾ:

border-end-start-radius: 50px;

CSS border-end-start-radius ਵਿਸ਼ੇਸ਼ਤਾ ਅਤੇ border-bottom-left-radius,border-bottom-right-radius,border-top-left-radius ਅਤੇ border-top-right-radius ਬਹੁਤ ਸਮਾਨ ਹਨ border-end-start-radius ਗੁਣ ਅੰਗੂਠੇ ਦੀ ਅਕਸਰ ਦਿਸ਼ਾ ਅਤੇ ਇਨਲਾਈਨ ਦਿਸ਼ਾ 'ਤੇ ਨਿਰਭਰ ਕਰਦੇ ਹਨ。

ਉਦਾਹਰਣ

ਉਦਾਹਰਣ 1

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

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

ਸਵੈ ਮੁਹਿੰਮ ਕਰੋ

ਉਦਾਹਰਣ 2: direction ਗੁਣ ਦੇ ਸਮੇਕਨ

ਅੰਗੂਠੇ ਦੀ ਅਕਸਰ ਦਿਸ਼ਾ ਦੇ ਅੰਤ ਅਤੇ ਇਨਲਾਈਨ ਦਿਸ਼ਾ ਦੇ ਸ਼ੁਰੂ ਵਿੱਚ ਦੀ ਅੰਗੂਠੇ ਦੇ ਅਕਸਰ ਆਕਾਰ ਦਾ ਸਥਾਨ ਇਸ ਦੇ ਅਧਾਰ 'ਤੇ ਪ੍ਰਭਾਵਿਤ ਹੁੰਦਾ ਹੈ。 direction ਗੁਣ ਦੇ ਪ੍ਰਭਾਵ:

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

ਸਵੈ ਮੁਹਿੰਮ ਕਰੋ

ਉਦਾਹਰਣ 3: writing-mode ਗੁਣ ਦੇ ਸਮੇਕਨ

ਅੰਗੂਠੇ ਦੀ ਅਕਸਰ ਦਿਸ਼ਾ ਦੇ ਅੰਤ ਅਤੇ ਇਨਲਾਈਨ ਦਿਸ਼ਾ ਦੇ ਸ਼ੁਰੂ ਵਿੱਚ ਦੀ ਅੰਗੂਠੇ ਦੇ ਅਕਸਰ ਆਕਾਰ ਦਾ ਸਥਾਨ ਇਸ ਦੇ ਅਧਾਰ 'ਤੇ ਪ੍ਰਭਾਵਿਤ ਹੁੰਦਾ ਹੈ。 writing-mode ਗੁਣ ਦੇ ਪ੍ਰਭਾਵ:

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

ਸਵੈ ਮੁਹਿੰਮ ਕਰੋ

CSS ਗਰੰਥ:

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

ਗੁਣ ਮੁੱਲ

ਤਕਨੀਕੀ ਵੇਰਵੇ

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

ਸਪਰੇਡਸ਼ਨ ਵਿੱਚ ਦਿਖਾਈ ਨੰਬਰ ਇਹ ਪਹਿਲਾ ਪੂਰੀ ਤਰ੍ਹਾਂ ਇਸ ਲੋੜ ਨੂੰ ਪੂਰਾ ਕਰਨ ਵਾਲਾ ਬਰਾਉਜ਼ਰ ਦਾ ਸੰਸਕਰਣ ਹੈ。

ਸਬੰਧਤ ਪੰਨੇ

ਸਿੱਖਿਆਕ੍ਰਮ:CSS ਗੂੜ੍ਹੇ ਕੋਨੇ

ਸਲਾਹਦਾਤਾਂ:CSS بوردر بہاؤ چپ چپ دائرہ اپریٹ

ਸਲਾਹਦਾਤਾਂ:CSS بوردر بہاؤ چپ چپ دائرہ اپریٹ

ਸਲਾਹਦਾਤਾਂ:CSS border-top-left-radius پراویارتی

ਸਲਾਹਦਾਤਾਂ:CSS border-top-right-radius پراویارتی

ਸਲਾਹਦਾਤਾਂ:CSS دیکشن کی اپریٹ

ਸਲਾਹਦਾਤਾਂ:CSS text-orientation ਪ੍ਰਤੀਯੋਗਿਤਾ

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