CSS బొర్డర్-ఎండ్-స్టార్ట్-రేడియస్ అట్రిబ్యూట్

నిర్వచనం మరియు వినియోగం

border-end-start-radius అమృతం ఉపయోగించబడుతుంది బ్లాక్ దిశ ముగింపు (block-end) మరియు వరుస దిశ ప్రారంభం (inline-start) మధ్య గుండాయి వెడల్పు నిర్వచించడానికి.

గమనిక:సంబంధిత 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;
}

స్వయంగా ప్రయత్నించండి

సిఎస్ఎస్ సంకేతబద్ధత

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

లక్షణ విలువ

సాంకేతిక వివరాలు

బ్రౌజర్ మద్దతు

పట్టికలో ఉన్న సంఖ్యలు ఈ లక్షణాన్ని పూర్తిగా మద్దతు ఇచ్చే మొదటి బ్రౌజర్ సంస్కరణను సూచిస్తాయి。

క్రియాశీల పేజీలు

教程：CSS కోన్ రేడియస్

参考：CSS బొర్డర్-బాటమ్-లెఫ్ట్-రేడియస్ అట్రిబ్యూట్

参考：CSS బొర్డర్-బాటమ్-రైట్-రేడియస్ అట్రిబ్యూట్

参考：CSS బార్డర్ టాప్ లెఫ్ట్ రేడియస్ అట్రిబ్యూట్

参考：CSS బార్డర్ టాప్ రైట్ రేడియస్ అట్రిబ్యూట్

参考：CSS దిరేక్షన్ అట్రిబ్యూట్

参考：CSS టెక్స్ట్-ఆరెంటేషన్ అట్రిబ్యూట్

参考：CSS వ్రాయింగ్-మోడ్ అట్రిబ్యూట్