本文介紹了ionic - 如何在 ion-header 中對長字符串進行自動換行的處理方法，對大家解決問題具有一定的參考價值，需要的朋友們下面隨著小編來一起學習吧！
問題描述
這是我的代碼，我試過 text-wrap ，里面 ion-header 仍然無法顯示整個標題.
This is my code, and I tried text-wrap , inside ion-header still can not show whole title.
<ion-header>
<ion-toolbar text-wrap color="danger">
<ion-buttons>
<button ion-button navPop icon-only>
<ion-icon ios="ios-arrow-back" md="md-arrow-back"></ion-icon>
</button>
</ion-buttons>
<ion-title>{{new.title}}</ion-title>
</ion-toolbar>
</ion-header>
更新
<ion-header>
<ion-toolbar color="danger">
<ion-buttons>
<button ion-button navPop icon-only>
<ion-icon ios="ios-arrow-back" md="md-arrow-back"></ion-icon>
</button>
</ion-buttons>
<ion-item color="danger" text-wrap>
<ion-title >{{new.title}}</ion-title>
</ion-item>
</ion-toolbar>
</ion-header>
我嘗試在那里添加 ion-item，但仍然不適合我.
I tried add ion-item there, but still not working for me.
更新 2
.ios .toolbar-title {
text-overflow: inherit;
white-space: normal;
text-align: left;
font-size:1.3em;
}
.md .toolbar-title {
text-overflow: inherit;
white-space: normal;
text-align: left;
font-size:1.3em;
}
推薦答案
請更新你的css文件如下:
Pls update your css file as below :
.toolbar-title {
text-overflow: inherit;
white-space: normal;
}
已
或者
.toolbar-title {
text-overflow: unset;
white-space: unset;
}
這篇關于ionic - 如何在 ion-header 中對長字符串進行自動換行的文章就介紹到這了，希望我們推薦的答案對大家有所幫助，也希望大家多多支持html5模板網！
【網站聲明】本站部分內容來源于互聯網,旨在幫助大家更快的解決問題，如果有圖片或者內容侵犯了您的權益，請聯系我們刪除處理，感謝您的支持！