標籤:

不同結構的表格樣式

在圈子裡看不出效果,請點擊查看原文欣賞!1.單行單列代碼:<TABLE style="BORDER-COLLAPSE: collapse" borderColor=#000000 cellSpacing=0 width_=300 align=center bgColor=#ffffff border=1><TBODY><TR><TD height=40><DIV align=center>單行單列</DIV></TD></TR></TBODY></TABLE>2.一行多列一行多列一行多列代碼:<TABLE style="BORDER-COLLAPSE: collapse" borderColor=#000000 cellSpacing=0 width_=300 align=center bgColor=#ffffff border=1><TBODY><TR><TD width_=100><DIV align=center>一行多列</DIV></TD><TD width_=100><DIV align=center>一行多列</DIV></TD><TD width_=100><DIV align=center>一行多列</DIV></TD></TR></TBODY></TABLE>3.一列多行一列多行一列多行代碼:<TABLE style="BORDER-COLLAPSE: collapse" borderColor=#000000 cellSpacing=0 width_=300 align=center bgColor=#ffffff border=1><TBODY><TR><TD><DIV align=center>一列多行</DIV></TD><TR><TD><DIV align=center>一列多行</DIV></TD><TR><TD><DIV align=center>一列多行</DIV></TD></TR></TR></TR></TBODY></TABLE>4.多行多列多行多列多行多列多行多列多行多列多行多列多行多列多行多列多行多列代碼:<TABLE style="BORDER-COLLAPSE: collapse" borderColor=#000000 cellSpacing=0 width_=300 align=center bgColor=#ffffff border=1><TBODY><TR><TD width_=100><DIV align=center>多行多列</DIV></TD><TD width_=100><DIV align=center>多行多列</DIV></TD><TD width_=100><DIV align=center>多行多列</DIV></TD><TR><TD><DIV align=center>多行多列</DIV></TD><TD><DIV align=center>多行多列</DIV></TD><TD><DIV align=center>多行多列</DIV></TD><TR><TD><DIV align=center>多行多列</DIV></TD><TD><DIV align=center>多行多列</DIV></TD><TD><DIV align=center>多行多列</DIV></TD></TR></TR></TR></TBODY></TABLE>5.合併列的表格合併列的表格合併列的表格合併列的表格合併列的表格合併列的表格合併列的表格代碼:<TABLE style="BORDER-COLLAPSE: collapse" borderColor=#000000 cellSpacing=0 width_=300 align=center bgColor=#ffffff border=1><TBODY><TR><TD colSpan=3><DIV align=center>合併列的表格</DIV></TD><TR><TD width_=100><DIV align=center>合併列的表格</DIV></TD><TD width_=100><DIV align=center>合併列的表格</DIV></TD><TD width_=100><DIV align=center>合併列的表格</DIV></TD><TR><TD><DIV align=center>合併列的表格</DIV></TD><TD><DIV align=center>合併列的表格</DIV></TD><TD><DIV align=center>合併列的表格</DIV></TD></TR></TR></TR></TBODY></TABLE>6.合併行的表格合併行的表格合併行的表格合併行的表格合併行的表格合併行的表格合併行的表格代碼:<TABLE style="BORDER-COLLAPSE: collapse" borderColor=#000000 cellSpacing=0 width_=300 align=center bgColor=#ffffff border=1><TBODY><TR><TD width_=100 rowSpan=3><DIV align=center>合併行的表格</DIV></TD><TD width_=100><DIV align=center>合併行的表格</DIV></TD><TD width_=100><DIV align=center>合併行的表格</DIV></TD><TR><TD><DIV align=center>合併行的表格</DIV></TD><TD><DIV align=center>合併行的表格</DIV></TD><TR><TD><DIV align=center>合併行的表格</DIV></TD><TD><DIV align=center>合併行的表格</DIV></TD></TR></TR></TR></TBODY></TABLE>7.複雜表格複雜表格複雜表格複雜表格複雜表格複雜表格複雜表格複雜表格複雜表格複雜表格複雜表格複雜表格複雜表格複雜表格複雜表格複雜表格代碼:<TABLE style="BORDER-COLLAPSE: collapse" borderColor=#000000 cellSpacing=0 width_=300 align=center bgColor=#ffffff border=1><TBODY><TR><TD width_=60><DIV align=center>複雜表格</DIV></TD><TD width_=180 colSpan=3><DIV align=center>複雜表格</DIV></TD><TD width_=60><DIV align=center>複雜表格</DIV></TD><TR><TD rowSpan=4><DIV align=center>複雜表格</DIV></TD><TD rowSpan=3><DIV align=center>複雜表格</DIV></TD><TD><DIV align=center>複雜表格</DIV></TD><TD><DIV align=center>複雜表格</DIV></TD><TD><DIV align=center>複雜表格</DIV></TD><TR><TD><DIV align=center>複雜表格</DIV></TD><TD><DIV align=center>複雜表格</DIV></TD><TD><DIV align=center>複雜表格</DIV></TD><TR><TD><DIV align=center>複雜表格</DIV></TD><TD><DIV align=center>複雜表格</DIV></TD><TD><DIV align=center>複雜表格</DIV></TD><TR><TD><DIV align=center>複雜表格</DIV></TD><TD colSpan=3><DIV align=center>複雜表格</DIV></TD></TR></TR></TR></TR></TR></TBODY></TABLE>8.隱藏 橫向 分隔線 隱藏 橫向 分隔線 隱藏 橫向 分隔線代碼:<TABLE style="BORDER-COLLAPSE: collapse" borderColor=#ff0033 cellSpacing=0 rules=cols width_=300 align=center bgColor=#e1f8ff border=1><TBODY><TR><TD width_=100>隱藏</TD><TD width_=100>橫向</TD><TD width_=100>分隔線</TD><TR><TD>隱藏</TD><TD>橫向</TD><TD>分隔線</TD><TR><TD>隱藏</TD><TD>橫向</TD><TD>分隔線</TD></TR></TR></TR></TBODY></TABLE>9.隱藏 縱向 分隔線 隱藏 縱向 分隔線 隱藏 縱向 分隔線代碼:<TABLE style="BORDER-COLLAPSE: collapse" borderColor=#ff0033 cellSpacing=0 rules=rows width_=300 align=center bgColor=#e1f8ff border=1><TBODY><TR><TD width_=100>隱藏</TD><TD width_=100>縱向</TD><TD width_=100>分隔線</TD><TR><TD>隱藏</TD><TD>縱向</TD><TD>分隔線</TD><TR><TD>隱藏</TD><TD>縱向</TD><TD>分隔線</TD></TR></TR></TR></TBODY></TABLE>10.隱藏 縱橫 分隔線 隱藏 縱橫 分隔線 隱藏 縱橫 分隔線代碼:<TABLE style="BORDER-COLLAPSE: collapse" borderColor=#ff0033 cellSpacing=0 rules=none width_=300 align=center bgColor=#e1f8ff border=1><TBODY><TR><TD width_=100>隱藏</TD><TD width_=100>縱橫</TD><TD width_=100>分隔線</TD><TR><TD>隱藏</TD><TD>縱橫</TD><TD>分隔線</TD><TR><TD>隱藏</TD><TD>縱橫</TD><TD>分隔線</TD></TR></TR></TR></TBODY></TABLE><TABLE borderColor=#111111 bgColor=#FFD2D2 cellSpacing=0 cellPadding=0 width_=250 align=center border=1 frame=rhs><TBODY><TR align=middle><TD height=40>只顯示右邊框</TD></TR></TBODY></TABLE>附:表格常用屬性border:表格的邊框寬度。如border=1,表示表格邊框的粗細為1個像素(默認值),為0表示沒有邊框。cellspacing:表格中各單元格的間距。屬性值為數字。當表格只有一個單元格時,則表示該單元格與表格邊框的距離。cellpadding:單元格內容與單元格邊框之間的距離,屬性值是數字。width:表格的寬度。屬性值為像素和百分比兩種。height:表格的高度。取值方法同width。bgcolor:表格的背景顏色。屬性值為各種顏色代碼。background:表格的背景圖案。屬性值為有效的圖片地址。bordercolor:表格邊框的顏色。屬性值為各種顏色代碼(當border值不為0時設置此值有效)。bordercolorlight:亮邊框(表格的左邊和上邊框)顏色。屬性值為各種顏色代碼(當border值不為0時設置此值有效)。bordercolordark:暗邊框(表格的右邊和下邊框)顏色。屬性值為各種顏色代碼(當border值不為0時設置此值有效)。align:表格的對齊方式。屬性值為left(左對齊,默認)、center(居中)以及right(右對齊)。colspan:定義合併表格的列數。屬性值是數字。rowspan定義合併表格的行數,屬性值是數字。

『ldm2124086音樂空間』歡迎你!
推薦閱讀:

《四柱八字》初學者必備基礎表格
孩子是不是你親生的,對照表格就能知道
非常實用的五行八字表格
中國歷代100個經典愛情故事(表格式)
中醫診斷學「脈診」表格總結(完整版)

TAG:表格 |