如何使標題左側與右側和側按鈕在jquery移動

Question

你能告訴我如何標題標題左側按鈕右側。

，我發現這樣的

<div data-role="header"> 
    <a href="index.html" data-icon="delete">Cancel</a> 
    <h1>Edit Contact</h1> 
    <a href="index.html" data-icon="check" data-theme="b">Save</a> 

但我需要像左側按鈕這個

我的情況下，標籤上的右側

Answer 1

你能做到這樣，DEMO http://jsfiddle.net/yeyene/5kfnT/3/

JQM DOC：http://view.jquerymobile.com/1.3.1/dist/demos/widgets/headers/

自定義標題配置

如果您需要創建一個不遵循默認配置的標題，只需將自定義樣式的標記包裝在任何容器（如div）中。該插件不會將自動按鈕邏輯應用於標題容器內的包裝內容，因此您可以編寫自定義樣式來佈置標題中的內容。

也可以根本不使用標頭data-role來創建自定義條。例如，從任何容器開始，添加ui-bar類以應用標準欄填充並添加ui-bar-b類以從您的主題分配條色板樣式。 （「B」類可以是任何樣本字母。）

<div data-role="header" data-position="fixed"> 
    <div class="ui-block-a"><h3>Header</h3></div> 
    <div class="ui-block-b">&nbsp;</div> 
    <div class="ui-block-c">&nbsp;</div> 
    <div class="ui-block-d"> 
     <a href="#" data-role="button" data-inline="true" data-mini="true">A</a> 
     <a href="#" data-role="button" data-inline="true" data-mini="true">B</a> 
     <a href="#" data-role="button" data-inline="true" data-mini="true">C</a> 
    </div> 
</div> 

Answer 2

你能做到這樣，覆蓋ui-title和ui-btn-right風格。但是，對於第二個按鈕，請給它一個自定義類，以便不會覆蓋與ui-btn-right這兩個按鈕。我使用第二個按鈕的自定義類.second。

Demo

CSS - 我爲了不改變頁腳樣式中使用.ui-header。

.ui-header .ui-title { 
    margin-left: 2px !important; 
    text-align: left !important; 
    width: 150px !important; 
} 

.second.ui-btn-right { 
    right: 80px !important 
} 

HTML

<div data-role="header"> 
    <a href="index.html" data-icon="delete" class="second ui-btn-right">Cancel</a> 
    <h1>Edit Contact</h1> 
    <a href="index.html" data-icon="check" data-theme="b" class="ui-btn-right">Save</a> 
</div>