如何減少tablesorter中的列的寬度

我想設置JQuery Tablesorter中列的寬度。如何減少tablesorter中的列的寬度

我有6列。我試圖調整適合我瀏覽器窗口的寬度，但由於某種原因，我無法調整標題寬度和<body>標記中的項目大小。
在這個例子中，我希望第一列爲10％，第二列爲10％，第三列爲10％，第四列爲50％，其餘兩列爲10％，每次增加100 ％。我試過這個：

.tablesorter td:nth-child(6n+1) { 
width: 10%; 
} 
.tablesorter td:nth-child(6n+2) { 
width: 10%; 
} 
.tablesorter td:nth-child(6n+3) { 
width: 10%; 
} 
.tablesorter td:nth-child(6n+4) { 
width: 50%; 
    } 
.tablesorter td:nth-child(6n+5) { 
width: 10%; 
} 
.tablesorter td:nth-child(6n+6) { 
width: 10%; 
    }

任何建議如何做到這一點？

來源

2016-01-13 user1234

工作對我來說：http://jsfiddle.net/Mottie/4mVfu/5649/，如果你想列可調整大小，則需要添加''resizable''到'widgets'選項，但是你將無法調整列的大小。 – Mottie

順便說一句，如果一個表列中的數據多於指定寬度的數據，表格就會盡可能寬。在@Mottie的小提琴中，這就是窄窗戶中較寬的列所發生的情況。使視口足夠寬，表將服從其CSS。 –

您可以一次將寬度應用於多個列。

.tablesorter td:nth-child(1), 
.tablesorter td:nth-child(2), 
.tablesorter td:nth-child(3), 
.tablesorter td:nth-child(5), 
.tablesorter td:nth-child(6) 
{ 
    width : 10% !important; 
    min-width : 100px !important; 
} 
.tablesorter td:nth-child(4) 
{ 
    width : 50% !important; 
    min-width : 200px !important; 
}

mid-width這裏只是爲了保持良好的外觀和感覺。但是你可以嘗試玩弄並找出預期的行爲。

另請嘗試在小部件選項中設置resizable_widths: [ '10%', '10%', '10%','50%','10%','10%']。但我相信這個選項的目的是保持可調整的寬度。請參閱文檔以獲得更好的幫助。

的jsfiddle：http://jsfiddle.net/cL2f6k18/

來源

2016-01-13 23:39:33 pratikpawar

在這種情況下，'！important'標誌不是必需的。 – Mottie

如何減少tablesorter中的列的寬度

回答

相關問題