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;
}

আপনার হাতে পরীক্ষা করুন

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 এটি একটি অ্যাট্রিবিউট