如何把各地的行邊界在jQuery Mobile的

我正在做我的HTML表格使用表迴流。我只是想在表格中的行周圍放置邊框。當我檢查通過鍍鉻元素，看到jQuery Mobile的追加下面的類表：如何把各地的行邊界在jQuery Mobile的

ui-responsive table-stroke ui-table ui-table-reflow

因此我看着添加以下樣式：

.ui-responsive .table-stroke .ui-table .ui-table-reflow tr 
{ 
    border-style:solid; 
    border-width:5px; 
}

但一些如何我仍不很無論屏幕大小如何，都可以在行周圍找到邊框。任何想法我怎麼能做到這一點

來源

2013-11-26 user481610

嘗試添加'！important'有時自定義樣式被默認樣式覆蓋。 – Omar

剛試過，現在並沒有這樣的運氣 – user481610

嘗試增加樣式'td'。編輯：檢查這https://developer.mozilla.org/samples/cssref/border-collapse.html – Omar

我從你的描述，你只需要在全寬和行周圍的邊框不是單個細胞，然後在桌子重排要再次圍繞各排邊界（這實際上是假設單元格顯示在不同的行上）。

如果所以這裏是一個DEMO

在CSS中，媒體查詢時，表上更寬的屏幕觀看了。在這種情況下，我們給TR（行）一個邊框，並將單元格邊框設置爲0.當屏幕很窄並且表格重排時，TR邊框爲0，TD邊框被設置。你應該在演示中使用CSS來獲得你想要的。

.ui-table tr { 
    border: 0px solid rgb(51,51,51); 
} 
.ui-table-reflow.ui-responsive td, .ui-table-reflow.ui-responsive th { 
    border: 2px solid rgb(51,51,51); 
    border-left:4px solid rgb(51,51,51); 
    border-right:4px solid rgb(51,51,51); 
} 
.ui-table-reflow.ui-responsive td:first-child, .ui-table-reflow.ui-responsive th:first-child { 
    border-top:4px solid rgb(51,51,51); 
} 
.ui-table-reflow.ui-responsive td:last-child, .ui-table-reflow.ui-responsive th:last-child { 
    border-bottom:4px solid rgb(51,51,51); 
} 


@media (min-width: 35em) { 
    .ui-table tr { 
     border: 4px solid rgb(51,51,51); 
    } 

    .ui-table-reflow.ui-responsive td, .ui-table-reflow.ui-responsive th { 
     border: 0; 
    } 
}

來源

2013-11-26 22:54:23 ezanker

謝謝你了！ – user481610

不客氣。 – ezanker

如何把各地的行邊界在jQuery Mobile的

回答

相關問題