html - 如何在 Chrome 中进行断词:打破所有工作?
问题描述
我有一个这样的文本区域:
textarea {
background: lightgray;
border: none;
font: 16px/16px Courier;
resize: none;
word-break: break-all;
}
<textarea cols="40" rows="10 wrap="hard">
[[Lorem]][[ipsum]][[dolor]][[sit]][[amet]][[consectetur]][[adipiscing]][[elit]][[sed]][[do]][[eiusmod]][[tempor]][[incididunt]][[ut]][[labore]][[et]][[dolore]][[magna]][[aliqua]][[Ut]][[enim]][[ad]][[minim]][[veniam]][[quis]][[nostrud]][[exercitation]][[ullamco]][[laboris]][[nisi]][[ut]][[aliquip]][[ex]][[ea]][[commodo]][[consequat]][[Duis]][[aute]][[irure]][[dolor]][[in]][[reprehenderit]][[in]][[voluptate]][[velit]][[esse]][[cillum]][[dolore]][[eu]][[fugiat]][[nulla]][[pariatur]][[Excepteur]][[sint]][[occaecat]][[cupidatat]][[non]][[proident]][[sunt]][[in]][[culpa]][[qui]][[officia]][[deserunt]][[mollit]][[anim]][[id]][[est]][[laborum]]
</textarea>
在 Firefox 中,我看到了这个:screenshot
但是在 Chrome 中,换行符是乱码:screenshot
我如何告诉 Chrome 在正好 40 个字符后换行,而不是更少或更多,就像 Firefox 一样?
解决方案
hyphens
与word-break
其他工具包一起使用。我希望这可以帮助你。
textarea {
background: lightgray;
border: none;
font: 16px/16px Courier;
resize: none;
word-break: break-all;
-ms-word-break: break-all;
word-break: break-all;
word-break: break-word; /* Non standard for WebKit */
-webkit-hyphens: auto;
-moz-hyphens: auto;
hyphens: auto;
}
<textarea cols="40" rows="10 wrap="hard">
[[Lorem]][[ipsum]][[dolor]][[sit]][[amet]][[consectetur]][[adipiscing]][[elit]][[sed]][[do]][[eiusmod]][[tempor]][[incididunt]][[ut]][[labore]][[et]][[dolore]][[magna]][[aliqua]][[Ut]][[enim]][[ad]][[minim]][[veniam]][[quis]][[nostrud]][[exercitation]][[ullamco]][[laboris]][[nisi]][[ut]][[aliquip]][[ex]][[ea]][[commodo]][[consequat]][[Duis]][[aute]][[irure]][[dolor]][[in]][[reprehenderit]][[in]][[voluptate]][[velit]][[esse]][[cillum]][[dolore]][[eu]][[fugiat]][[nulla]][[pariatur]][[Excepteur]][[sint]][[occaecat]][[cupidatat]][[non]][[proident]][[sunt]][[in]][[culpa]][[qui]][[officia]][[deserunt]][[mollit]][[anim]][[id]][[est]][[laborum]]
</textarea>
推荐阅读
- php - 在调用者函数上强制返回语句
- android - MenuItem 在使用 Firebase 远程配置时抛出 NullPointerException
- r - 如何绘制多个变量的平均值作为 r 中多个组的 y 值?
- android - 通过 Internet 访问 Android 设备上的 API
- java - RecyclerView 错误未连接适配器;跳过布局并设置 OnClickListener
- python - 为我明确导入的模块获取错误
- r - 我用 R 计算 IDI 和 NRI 有问题
- ruby-on-rails - ActionController::InvalidAuthenticityToken 更新密码
- c++ - DirectX:在设备之前获取 InfoQueue
- html - 错误类型错误:无法读取未定义的属性“项目名称”