ট্যাগ wbr

ট্যাগ wbr একটি স্থান নির্দেশ করে যেখানে ব্রাউজার প্রয়োজনে একটি লাইন ব্রেক করতে পারে (যদি টেক্সটটি এলিমেন্টের প্রস্থের মধ্যে না fits)। এই ধরনের ব্রেকগুলিকে নরম ব্রেক বলা হয়।

ক্লোজিং ট্যাগের প্রয়োজন নেই।

ট্যাগ wbr এর মাধ্যমে একটি শব্দ ব্রেক করার সময়, হাইফেন "-" যোগ করা হয় না। যদি আপনার এটি প্রয়োজন হয় - নরম হাইফেন সিম্বল ­ ব্যবহার করুন (শেষে সেমিকোলন বাধ্যতামূলক, এটি একটি ত্রুটি নয়)।

নরম হাইফেন ­ ব্রাউজারকে একটি স্থান নির্দেশ করে যেখানে এটি একটি শব্দ ব্রেক করতে পারে (প্রয়োজনে), সেই সময়ে একটি হাইফেন "-" সিম্বল রেখে।

নরম হাইফেন ­ কাজ করবে না যদি প্রপার্টি hyphens none ভ্যালুতে সেট করা থাকে (কিন্তু wbr ব্রেকগুলি কাজ করবে)।

উদাহরণ . ব্রেক ছাড়া টেক্সট

আসুন একটি টেক্সট স্যাম্পল দেখি যেখানে দীর্ঘ শব্দ আছে যা ব্লকের সীমানা থেকে বেরিয়ে যায়। ব্লকটিতে একটি ছোট প্রস্থ সেট করি যাতে একটি বড় শব্দ এটিতে fit না হয়:

html<div id="elem">
  this is supersupersuperlong text
</div>
css#elem {
  width: 200px;
  border: 1px solid black;
}

Результат:

উদাহরণ . ট্যাগ wbr

এবং এখানে, আসুন wbr ট্যাগ যোগ করি সেই স্থানগুলিতে যেখানে আমরা ব্রাউজারকে সুপারিশ করি প্রয়োজনে শব্দটি ব্রেক করতে (মনোযোগ দিন এই বিষয়টিতে যে ব্রাউজারটি ব্রেক করবে না আমরা যেখানে নির্দেশ করেছি তার সব জায়গায়):

html<div id="elem">
  this is super<wbr>super<wbr>super<wbr>long text
</div>
css#elem {
  width: 200px;
  border: 1px solid black;
}

Результат:

উদাহরণ . সিম্বল &shy;

আসুন wbr ট্যাগের পরিবর্তে &shy; সিম্বল ব্যবহার করে দেখি। ব্রেকের স্থানগুলিতে হাইফেন প্রদর্শিত হবে:

html<div id="elem">
  this is super­super­super­long text
</div>
css#elem {
  width: 200px;
  border: 1px solid black;
}

Результат:

আরও দেখুন

  • ট্যাগ br,
    ,
    যা একটি নতুন লাইনে ব্রেক তৈরি করে
  • প্রপার্টি hyphens,
    যা প্রকৃত শব্দ বিভাজন সেট করে
  • প্রপার্টি word-break এবং overflow-wrap,
    যা একটি দীর্ঘ শব্দের অক্ষরগুলি ব্রেক করতে দেয়
  • প্রপার্টি overflow,
    যা ব্লকের সীমানার বাইরে থাকা অংশগুলি কেটে দেয়