哪些元素可以使用，而不是具有相同屬性的表？

我有很多圖片具有相同的大小，我想用它們來幻燈片。所以他們必須在一行，也許這行的寬度比窗口的寬度大，我想有些圖片走出屏幕，而不是他們在下一行。之前，現在我使用的表，使他們在一排，我只是把桌子讓這個幻燈片[這樣的：]。哪些元素可以使用，而不是具有相同屬性的表？

<table cellspacing="0" cellpadding="0"> 
    <img src="..." /> 
    <img src="..." /> 
    <img src="..." /> 
    <img src="..." /> 
    <img src="..." /> 
    <img src="..." /> 
    ... 
</table>

，但我想用另一種元素[例如一個div與一些CSS因爲表在我的頁面中產生一些問題

來源

2012-07-12 Alireza29675

是您的表，因爲你沒有使用'造成的問題'和''標籤？或者當你在這裏粘貼示例代碼時，你錯過了這個嗎？ – 2012-07-12 08:48:38

用最少的代碼和解決方案沒有「黑客」。

<div style="white-space:nowrap;"> 
     <img src="..." /> 
     <img src="..." /> 
     <img src="..." /> 
     <img src="..." /> 
     <img src="..." /> 
     <img src="..." /> 
     ... 
    </div>

DEMO

來源

2012-07-12 08:47:59

非常感謝..有沒有什麼辦法可以在設計div後去除圖片之間的空白？ – Alireza29675 2012-07-12 10:21:09

設定邊距：0px;爲圖像。 – 2012-07-12 10:36:48

它沒有工作！ – Alireza29675 2012-07-12 11:59:45

最常見的是，在這樣的滑塊插件中使用了無序列表。

<ul> 
    <li><img .../></li> 
    <li><img .../></li> 
    <li><img .../></li> 
</ul>

與

li{float:left;}

這具有的優點，就可以把更多的元素到<li>元件（例如圖像+描述+短文本）。

，但如果你想組合在一起多個元素（例如，用於圖像的解釋）你有額外的div來包裝他們，你可以使用一個簡單的DIV以及

<div> 
    <img /> 
    <img /> 
</div>

。（其中有效帶你回到了UL ......）

<div> 
    <div><img /> Text</div> 
    <div><img /> more Text</div> 
</div>

而且只爲你的信息，使用一個表中的正確的方法是：

<table> 
    <tr>  <!-- the row --> 
    <td></td> <!-- columns --> 
    <td></td> <!-- columns --> 
    </tr> 
</table>

來源

2012-07-12 08:47:23 Christoph

嘿，現在使用這種格式

<div class="slideshow"> 
    <img src="..." /> 
    <img src="..." /> 
    <img src="..." /> 
    <img src="..." /> 
    <img src="..." /> 
    <img src="..." /> 
    ... 
</div>

的CSS

.slideshow{ 
white-space: nowrap; 
} 
.slideshow img{ 
vertical-align:top; 
}

來源

2012-07-12 08:50:27

哪些元素可以使用，而不是具有相同屬性的表？

回答

相關問題