HTML表格中的樣式列單元格

我正在研究一個asp.net mvc 3應用程序。下面是表列我想風格的打印屏幕：HTML表格中的樣式列單元格

Table column

我西里爾遺憾。在單元格中的每一行與此代碼創建：

   @:<span class="TableColumn4"> 
       @field[i].QuestionText; 
       @:: 
       @field[i].FieldValue; 
       @:</span>

而CSS是：

span.TableColumn4 { 
    background: lightgrey; 
    display: block; 
}

我想要的是 - 你可以看到一切都在小區的中間留下了很多在單元格頂部和底部的空白空間。我想讓文本更平均一些。我試圖在CSS中添加一些padding-bottom，但它不適合這項工作。

來源

2013-05-13 Leron

你可以在jsfiddle上模擬相同的情況 – dreamweiver 2013-05-13 13:57:48

說實話，我沒有經驗在jsfiddle中做事。這將需要我太多時間來重新創建。 – Leron 2013-05-13 13:59:53

jsfiddle是超級簡單而實用的。這只是複製/粘貼您的HTML標記和CSS的問題。我強烈建議試試:)。 – 2013-05-13 14:04:35

你想讓文字上方和下方的空間變小嗎？它看起來像是讓表格單元格的高度擴大。有問題的單元格的左側或右側是否填充了該行的整個高度？可能有一個高度適用於該行。嘗試將height:auto;添加到行和單元格中。

來源

2013-05-13 14:00:47 Dustin

看來，身高：自動;和行高;在我的情況下，行爲幾乎相同，除非我將行高設置爲像3px這樣的小東西。我不知道爲什麼填充不起作用。 – Leron 2013-05-13 14:10:42

有問題的單元格左側或右側單元格中是否有任何內容？我只是有一種感覺，那就是讓這一行擴大。 – Dustin 2013-05-13 14:14:09

是的，就像在原始文章中所說的那樣，打印屏幕只是我喜歡的樣式欄，它甚至不是列，而是特定的單元格。有四列，並且行的高度默認情況下從最高單元格中確定，這不是我在此處顯示的單元格。實際上它是從這個單元格留下的單元格，但在那裏一切正常，但由於左側單元格比這更大，我想要設置此單元格中的文本以更均勻地佔據空間。 – Leron 2013-05-13 14:20:59

也許CSS屬性「line-height」將幫助你。但是，這對於整個表格的一個單元格來說似乎是非常有限的修補程序。如果你可以添加你的標記和CSS到一個新的Fiddle，那麼這將有助於提出一個更優雅的解決方案。如果你想讓背景顏色填充整個單元格（而不僅僅是文本的位置）以避免文本上方和下方的白色，那麼你應該將「背景顏色」CSS應用到類中在你的「td」標籤上，而不是跨越td。

來源

2013-05-13 14:00:59 JacobMcLock

不，顏色只是...不知道它不會留下來。但是如果span標籤之間的空間可以調節，那將會很好。行高似乎不適用於我的情況。 – Leron 2013-05-13 14:11:55

HTML表格中的樣式列單元格

回答

相關問題