jQuery Mobile - 工具栏Elipse在iPad中

我使用jQuery Mobile在iPad应用程序中本地呈现HTML。即使有很多空间，标题中也会显示“......”的缩略图。我正在使用现成的JQM和JQM CSS类。jQuery Mobile - 工具栏Elipse在iPad中

如何让JQM呈现完整标题？

下面是一些蓝色标记的屏幕截图。

这里的标题：

`<div data-role='header' data-position='inline'> 
     <h1>the long title goes here</h1></div>`

enter image description here

来源

2012-03-30 BahaiResearch.com

土地是否使用煎茶吗？ – codaniel 2012-03-30 21:29:09

不，我们使用MonoTouch – 2012-03-31 04:41:45

的h1标签获取边缘涂敷，您可以覆盖等多项称号将不会裁剪这么多。

.ui-page .ui-header h1 { 
    margin-left : 0; 
    margin-right : 0; 
}

这里是一个演示：http://jsfiddle.net/ubYWU/

注意，你会想给left/rightmargin值，它使得你的标题不会与你的图标（S）重叠。

来源

2012-03-30 21:20:55 Jasper

设置溢出的组合：隐藏和文本溢出：省略号是什么导致重写ui标题，然后播放边距尝试和居中。他们可能包括这个为页眉和页脚中的按钮留出空间。试试这个：

.ui-header .ui-title, .ui-footer .ui-title { 
    overflow:visible; 
    margin: .6em 20%; 
}

为此，JQM 1.1-RC1的默认左右页边距被设置为30％。只需调整它，直到它适合您的需求。

更新：我添加了使用30％默认值的版本。谢谢贾斯帕。

来源

2012-03-30 21:27:45 codaniel

jQuery Mobile 1.0.1和更早版本声明这个CSS为'.ui-title'：'margin：.6em 90px .8em;'。 jQuery Mobile 1.1.0 RC-1是为'left' /'right'' margin'属性使用'30％'的第一个里程碑。您可以通过查看每个版本的文档来查看。 – Jasper 2012-03-30 21:43:34

同样重要的是要注意，你应该“线高度：”添加到您的元素，因此如果他们换，他们不会在上面对方2号线

来源

2012-03-31 00:43:32 imaginethepoet

jQuery Mobile - 工具栏Elipse在iPad中

回答

相关问题