Question

我有一个<blockquote>元素，其中包含长行（984个字符），没有空格；仅字母，数字和符号。目前，它似乎在符号/标点处换行，导致随机长度的难看线条。是否可以将所有行（最后一行除外）都包裹成相同的长度？

我尝试使用style="overflow-wrap:break-word;"，但无济于事。

Answer 1

使用Word-Break: break-all

https://www.w3schools.com/cssref/css3_pr_word-break.asp

演示： JSFiddle

Answer 2

我们似乎都同意word-break: break-all

请注意，诸如?之类的某些符号也会允许随机换行

let possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";

function makeText(num) {
  let text = "";
  for (let i = 0; i < num; i++)
    text += possible.charAt(Math.floor(Math.random() * possible.length));
  return text;
}
let text = makeText(984);
document.querySelector("blockquote.wrapped").textContent = text;
document.querySelector("blockquote.notWrapped").textContent = text;
possible += `+"*ç%&/()=?`;
document.querySelector("blockquote.notWRappedWithSymbols").textContent = makeText(984);

blockquote.wrapped { word-break: break-all }

<blockquote class="wrapped"></blockquote>
<blockquote class="notWrapped"></blockquote>
<blockquote class="notWRappedWithSymbols"></blockquote>

将长行换成<blockquote>，使各行的长度相等

2 个答案: