任何人都可以告诉我一些破解单词的解决方案,如下图所示,使用css或jquery。
样本1
ConfigTechnologyHormonyAppComponentBackOfficeLaunch
需要将其分解为
ConfigTechnologyHo
rmonyAppComponentB
ackOfficeLaunch
SAMPLE 2
WorkAppComponentBackOfficeLaunchTechnologyNeteseen
需要将其分解为
WorkAppComponentBa
ckOfficeLaunchTech
nologyNeteseen
SAMPLE 3
Supplement Hormony based on Continous Integration
需要将其分解为
Supplement Hormony
based on Continous
Integration
我尝试使用word-break: break-all;
,但它无效
答案 0 :(得分:4)
.container{
max-width:100px;
border:thin black solid;
word-break:break-all;
height:auto;
}
<div class="container">Config TechnologyHormonyApp ComponentBackOfficeLaunch</div>
试试这个。
希望这有帮助。
PS:根据您的需要更改容器 max-width
。
答案 1 :(得分:4)
您需要根据文本容器的布局要求指定max-width
。
看看:
CSS:
p {
max-width: 100px;
word-break: break-all;
}
HTML:
<p>
ConfigTechnologyHormonyAppComponentBackOfficeLaunch
</p>
答案 2 :(得分:1)
尝试这样的事情:
.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>
答案 3 :(得分:1)
您可以使用javascript
执行此操作Auction.AuctionNotiNewInv.isDisplayed().then(function(){
Auction.NotificationTitle.get(0).isDisplayed().then(function(){
Auction.NotificationTitle.count().then(function(Count){
console.log(Count);
var NotifTitleCount = Count;
for(var i=0; i < NotifTitleCount; i++) {
Auction.NotificationTitle.get(i).isDisplayed().then(function(){
Auction.NotifAuctioneer.isDisplayed().then(function(IsDisplayed){
if(IsDisplayed)
Auction.NotificationTitle.get(i).click();
else
console.log('New Auction invitation is not displayed.');
});
});
}
});
});
});