word-break ဂုဏ်သတ္တိ

word-break ဂုဏ်သတ္တိသည် ကွန်တိန်နာ၏အကျယ်ထဲသို့ မဝင်နိုင်သော စကားလုံးတစ်လုံး၏ စာလုံးများကို လိုင်းအသစ်သို့ ကူးပြောင်းခွင့်ပြုပါသည်။

ဝါကျဖွဲ့ပုံ

cssselector {
  word-break: break-all | keep-all | normal;
}

တန်ဖိုးများ

ပုံမှန်တန်ဖိုး - normal.

ဥပမာ . normal တန်ဖိုး

ဤဥပမာတွင် အလွန်ရှည်လျားသောစကားလုံးသည် ကွန်တိန်နာထဲသို့ မနေရာချနိုင်ပဲ ၎င်း၏နယ်နိမိတ်ကို ကျော်လွန်ထွက်သွားမည်ဖြစ်သည် (ဤအခါတွင် လိုင်းအသစ်မှ စတင်မည်)။

html<div id="elem">
  Lorem ipsum dolor sit amet
  loooooooooooooooooooooooooooooooongword,
  consectetur adipiscing elit.
</div>

css#elem {
  width: 200px;
  word-break: normal;
  border: 1px solid red;
}

Результат:

ဥပမာ . break-all တန်ဖိုး

ယခုတော့ နေရာမကျနိုင်သော စာလုံးများသည် လာမည့်လိုင်းသို့ ကူးပြောင်းသွားမည်ဖြစ်သည်။

html<div id="elem">
  Lorem ipsum dolor sit amet
  loooooooooooooooooooooooooooooooongword,
  consectetur adipiscing elit.
</div>

css#elem {
  width: 200px;
  word-break: break-all;
  border: 1px solid red;
}

Результат:

ဒါလည်းကြည့်ပါ