Ausrichten der Jquery-mobile-header-Titel
Nur Frage mich, wenn jemand wusste, wie man das Standardverhalten überschreiben, in Jquery mobile zu richten Sie die Kopfzeile nach Links und halten das gleiche format. Ich kann nicht scheinen, um es zu line-up. Hier ist, was ich habe:
<div class="ui-body-x" data-role="header" data-position="fixed">
<div class="ui-grid-x">
<h1 class="ui-link">Add New Record</h1>
<div data-type="horizontal" style="top:5px;position:absolute;float:right;z-index:10;display:inline;" align="right" class="ui-btn-right">
<a href="www.google.com" data-role="link" data-icon="settings" data-ajax="false">Cancel</a>
<a href="www.google.com" class="ui-btn-up-x" data-role="button" data-icon="" data-ajax="false">Submit</a>
</div>
</div>
</div><!-- /header -->
nun ist diese erfolgreich, verschiebt sich der header auf der linken Seite, aber der text nicht immer das gleiche format. Riesige wächst und der Abstand ist alles falsch. Hat jemand hatte keinen Erfolg Links ausrichten die überschrift? Vielen Dank im Voraus.
Sorry, wenn dies ist eine noob Frage. Ich bin gerade jetzt, sich über die Website von native mobile Anwendungen...
InformationsquelleAutor gabaum10 | 2011-08-31
Du musst angemeldet sein, um einen Kommentar abzugeben.
Suchen, wie die Dinge angeordnet sind, in den header, benutzen Sie die absolute Positionierung für die Schaltflächen und den text-align auf den Titel.
Sie können richten Sie den text auf der linken Seite und ändern Sie die position des linken button der folgenden Weise (natürlich sollten Sie erreichen dies, indem Sie
class
stattstyle
Attribute richtig):immer nervös, dass änderungen wie diese werden nachteilig beeinflusst die Anordnung auf einer der JQM getesteten Geräten. Sieht sicher genug, wenn, und funktioniert gut!
Wenn Sie der Empfehlung Folgen, diese styles in eine CSS-Klasse hinzufügen
!important
hinter den Werten, oder Sie werden überschrieben, wenn JQM verbessert die markup. Beispiel:.page-title-left { text-align: left !important; margin-left: 10px !important;}
InformationsquelleAutor pauloya
Das einzige, was Sie tun müssen, ist, wickeln Sie den h1-tag in einem div-tag, das ist nicht die div data-role="header". Ihr code sollte wie folgt Aussehen...
Brauchen Sie nicht, um text auszurichten, weil das div, das einwickeln der h1-tag deaktiviert die jQuery. Einige Rand um den text, da werden den ganzen Weg auf der linken Seite alles, was Sie tun müssen, ist das hinzufügen von CSS-und so sollte es Aussehen...
Geben Sie einige linken Rand in der linken.
InformationsquelleAutor Gilbert