您的位置:首页 > Web前端 > JQuery

jquerymobile 显示全部文字并自动换行

2017-12-29 18:16 309 查看
jquerymobile 有些控件如 listview 内文字如果太长默认会截取一部分后面加... ,如果要显示全部并自动换行的话只要设置该文字的 css 就可以了

以下面内容为例

<body>
<div data-role="page">
<div data-role="content">
<ul data-role="listview" data-inset="true" id="doctor-listview">
<li class="ui-first-child">
<a href="index.html" class="ui-btn ui-btn-icon-right ui-icon-carat-r">
<p>内容很长很长,内容很长很长,内容很长很长,内容很长很长,内容很长很长,内容很长很长</p>
</a>
</li>
</ul>
</div>
</div>
</body>


先上效果图:

设置前默认效果



设置后效果



 css 代码:

.ui-listview>li p{
white-space:normal;
}


如果设置无效注意检查 css 的选择器是否选择正确,下面有一些 jquerymobile 自带的默认 css 样式,如果是标准布局也可以按这个设置

.ui-listview>.ui-li-static, .ui-listview>.ui-li-divider, .ui-listview>li>a.ui-btn{
white-space:normal;
}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  jquerymobile
相关文章推荐