jQuery的對準錶（行/細胞數）

我有這樣的表（8個細胞僅用於說明的目的，可以存在更多或更少）：jQuery的對準錶（行/細胞數）

[1] [2] [3] [4] 
[5] [6] [7] [8]

在每個小區中的每個項目寬度大約爲450px，因此它們在1920x1200屏幕上相互舒適地相鄰（這在我的意義上是我的）。但是，我需要這種配置來自動更改並調整最佳方式，以防出現具有較小（或較寬）屏幕分辨率的人或調整瀏覽器窗口大小。

因此，對於1024×768這將是：

[1] [2] 
[3] [4] 
(etc)

和2560×1600這將是：

[1] [2] [3] [4] [5] 
[6] [7] [8] [9] [10] 
(etc)

我怎樣才能做這樣的事情 - 也許與jQuery或CSS？

來源

2010-07-12 Alex

你可能會看看谷歌是如何做到的 - 如果你檢查他們的圖片搜索源，你會看到他們是這麼做的。雖然他們的JS不是最易讀的，但你也許可以用JS調試器來獲得一些東西 – Mala 2010-07-12 04:53:45

而不是使用表使用無序列表。確保無序列表本身（或者其容器）的寬度是一個百分比寬度（它將縮放到瀏覽器窗口的大小）。將每個<li>元素浮動，並指定寬度（如果您希望它們的大小相同）。瀏覽器將爲您完成剩下的工作。

例子：

HTML: 
<ul id="mydata"> 
    <li>1</li> 
    <li>2</li> 
    <li>3</li> 
</ul> 

CSS: 
ul#mydata { width: 90%; } 
    ul#mydata li { width: 450px; float: left; } /* Don't *have* to specify width */

來源

2010-07-12 04:47:47

我搜索，只是我發現

不要使用「表」，使用「分區，設置樣式屬性‘浮法：左’每個格。 ..並設置寬度和你的塊的高度，它會工作，像這樣：

<div style=\"width: 100px; height: 100px; float: left\">CONTENT</div> 
<div style=\"width: 100px; height: 100px; float: left\">CONTENT</div> 
<div style=\"width: 100px; height: 100px; float: left\">CONTENT</div> 
<div style=\"width: 100px; height: 100px; float: left\">CONTENT</div> 
<div style=\"width: 100px; height: 100px; float: left\">CONTENT</div> 
<div style=\"width: 100px; height: 100px; float: left\">CONTENT</div>

並嘗試調整您的網頁，例如

。

希望它能幫助別人。

Cerdan

來源

2013-03-11 03:22:08 user1773370

jQuery的對準錶（行/細胞數）

回答

相關問題