跨度即將到來

我正在嘗試在我的頁面中實現分頁。跨度即將到來

<span height="40px"><span class="pg-normal" onclick="pager.prev();"> « Prev </span> 
| 
<span id="pg1" class="pg-selected" onclick="pager.showPage(1);" style="display: block;">1</span> 
<span id="sp1" style="display: block;">|</span> 
<span id="pg2" class="pg-normal" onclick="pager.showPage(2);" style="display: block;">2</span> 
<span id="sp2" style="display: block;">|</span> 
<span id="pg3" class="pg-normal" onclick="pager.showPage(3);" style="display: block;">3</span> 
    <span id="sp3" style="display: block;">|</span></span>

除了這個CSS問題之外，它幾乎完成了。
我已創建JSFIDDLE。我希望得到的結果不是來自單線。任何幫助將是非常有用的。

來源

2012-04-09 Pranav

那是因爲他們都需要他們走出內嵌tekst流，並將它們放在一個單獨的線風格display: block。

這是一個可行的小提琴： http://jsfiddle.net/sg3s/bGMa9/2/

如果你想他們的風格像塊元素，但不是讓他們離開tekst流量可以使用display: inline-block或使他們成爲一個塊級元素，但使用float: left;使他們坐在一起。

來源

2012-04-09 13:33:37 sg3s

感謝它正在工作.... – Pranav 2012-04-09 13:35:29

@Pranav，除非你確切知道你在做什麼，否則不要使用浮動。未清理的浮動可能導致各種佈局問題。 'inline-block'是一個更好的建議，以防需要將跨度設置爲塊級元素。 – bfavaretto 2012-04-09 14:32:26

@bfavaretto：謝謝..我會按照你的意見。 – Pranav 2012-04-10 04:19:31

跨度堆疊，因爲你給他們display: block;。只要刪除它們，它們應該全部內聯。

UPDATE

你說你要顯示和隱藏的元素。要使用內聯元素執行此操作，只需將display設置爲none進行隱藏，然後將''（空字符串）或inline設置爲顯示。

見http://jsfiddle.net/bGMa9/4/

來源

2012-04-09 13:30:54 bfavaretto

其實我需要顯示和隱藏跨度，這就是爲什麼我給了塊; – Pranav 2012-04-09 13:31:55

您可以使用display：inline/display：none來顯示和隱藏。我建議像Alex Morales所說的那樣漂浮他們。 – 2012-04-09 13:33:14

跨度即將到來

回答

相關問題