সিএসএস(৩) word-break প্রোপার্টি
ব্রাউজার সাপোর্ট
property | Google Chrome | Edge | Mozila Firefox | Safari | Opera |
---|---|---|---|---|---|
word-break | ৪.০ | ৫.৫ | ১৫.০ | ৩.১ | ১৫.০ |
সংজ্ঞা ও ব্যবহার
word-break প্রোপার্টি non-CJK স্ক্রিপ্টগুলোর জন্য লাইন ব্রেক করা নিয়ম নির্দিষ্ট করে।
পরামর্শঃ
- CJK স্ক্রিপ্ট হলো Chinese, Japanese এবং Korean ("CJK") স্ক্রিপ্ট।
Initial Value: | Inherited: | Animatable: |
---|---|---|
normal | হ্যাঁ | না। আরোও জানতে animatable অধ্যায় ভিজিট করুন। |
সিএসএস সিনট্যাক্স
word-break: normal/break-all/keep-all/initial/inherit;
দুইটি বর্ণের মধ্যে ওয়ার্ড ব্রেক হবেঃ
উদাহরণ
<!DOCTYPE html>
<html>
<head>
<title>সিএসএস রেফারেন্স উদাহরণ</title>
<style>
p.text1 {
width: 140px;
border: 1px solid #000000;
word-break: keep-all;
}
p.text2 {
width: 140px;
border: 1px solid #000000;
word-break: break-all;
}
</style>
</head>
<body>
<p class="text1">এই প্যারাগ্রাফে কিছু টেক্সট রয়েছে। এক্ষেত্রে-হাইফেনে-লাইন-ব্রেক-করবে।</p>
<p class="text2">এই প্যারাগ্রাফেও কিছু টেক্সট রয়েছে। এক্ষেত্রে যেকোন ক্যারেক্টারেই লাইন ব্রেক করবে।</p>
<p><b>নোট:</b>word-break প্রোপার্টিটি অপেরা ১২ এবং পূর্ববর্তী ভার্সনে সাপোর্ট করে না। </p>
</body>
</html>
ফলাফল
জাভাস্ক্রিপ্ট সিনট্যাক্স
object.style.wordBreak="break-all"
উদাহরণঃ
<!DOCTYPE html>
<html>
<head>
<style>
#syntax {
width: 150px;
height: 100px;
background-color: lightblue;
border: 1px solid black;
}
</style>
</head>
<body>
<p>"ক্লিক করি" বাটনে ক্লিক করি এবং লক্ষ্য করি:</p>
<button onclick="myFunction()">ক্লিক করি</button>
<div id="syntax">
হতেপারেএটিএকটিঅনেকবড়শব্দযেটিসম্পূর্ণলাইনেধরবেনা
</div>
<script>
function myFunction() {
document.getElementById("syntax").style.wordBreak = "break-all;
}
</script>
</body>
</html>
ফলাফল
word-breakপ্রোপার্টির ভ্যালু-সমূহ
- normal - ডিফল্ট ভ্যালু। স্বাভাবিক নিয়ম অনুযায়ী ওয়ার্ড ব্রেক হবে।
- break-all - যেকোনো দুইটি বর্ণের মধ্যে লাইন ব্রেক হবে।
- keep-all -জোড়া বর্ণের মধ্যে ব্রেক হবে না।
- initial - সিএসএস প্রোপার্টির ডিফল্ট ভ্যালু সেট করে। আরও জানতে initial অধ্যায় ভিজিট করুন।
- inherit - এই প্রোপার্টির ভ্যালু প্যারেন্ট এলিমেন্ট থেকে উত্তরাধিকার সূত্রে পায়। আরও জানতে inherit অধ্যায় ভিজিট করুন।