[英]break long word into multiple lines
Can anyone please tell me some solution to break word like as shown below using css or jquery. 谁能告诉我一些解决方法,如下所示使用css或jquery来打断单词。
SAMPLE 1 样本1
ConfigTechnologyHormonyAppComponentBackOfficeLaunch
Need to break it into 需要分解成
ConfigTechnologyHo
rmonyAppComponentB
ackOfficeLaunch
SAMPLE 2 样本2
WorkAppComponentBackOfficeLaunchTechnologyNeteseen
Need to break it into 需要分解成
WorkAppComponentBa
ckOfficeLaunchTech
nologyNeteseen
SAMPLE 3 样本3
Supplement Hormony based on Continous Integration
Need to break it into 需要分解成
Supplement Hormony
based on Continous
Integration
I have tried with word-break: break-all;
我尝试过
word-break: break-all;
but its is not working 但它不起作用
.container{ max-width:100px; border:thin black solid; word-break:break-all; height:auto; }
<div class="container">Config TechnologyHormonyApp ComponentBackOfficeLaunch</div>
Try this. 尝试这个。
Hope this helps. 希望这可以帮助。
PS: change container max-width
as per your need. PS:根据您的需要更改容器的
max-width
。
You need to specify a max-width
according to your layout requirement for the text container. 您需要根据文本容器的布局要求指定
max-width
。 Have a look: 看一看:
CSS: CSS:
p {
max-width: 100px;
word-break: break-all;
}
HTML: HTML:
<p>
ConfigTechnologyHormonyAppComponentBackOfficeLaunch
</p>
Try something like this: 尝试这样的事情:
.product-name a:before { content:"ConfigTechnologyHo \\A rmonyAppComponentB \\A ackOfficeLaunch "; white-space: pre; font-size:18px; } .product-name a { text-indent:-9999px; font-size:0; text-decoration: none; }
<h2 class="product-name"> <a></a> </h2>
You can do this with javascript 您可以使用javascript执行此操作
var text = 'WorkAppComponentBackOfficeLaunchTechnologyNeteseen';
var array = text.split('');
len = 18;//length of a single row
var newtext = '';
for(var i=0;i<array.length;i++) {
newtext +=array[i];
if (i % len == 0 && i>1) {
newtext += '</br>';//or \n\r
}
}
document.getElementById('text').innerHTML = newtext;
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.