CSS Table 表格邊框樣式
文章推薦指數: 80 %
列出與表格邊框樣式,有關的CSS 屬性, 透過CSS 來制定HTML 表格的樣式, CSS 中的border-collapse, collapse, separate 分別可以設置表格的邊框是否被合併成一個邊框。
CSS樣式CSSTable表格邊框樣式、邊框設計
CSSTable表格
制定表格的樣式,透過CSS就不需要在HTML內用到border,cellpadding,cellspacing的屬性。
CSS屬性使用border-collapse可以代替cellspacing=0的宣告。
CSS中的border-collapse:collapse||separate可以設置表格的邊框是否被合併成一個邊框。
border-collapse:collapse
設置表格的邊框被合併成一個邊框
TableCaptionTB_COLLAPSETHHeaderTHHeaderTHHeader
TFfootTFfootTFfoot
row1row1row1
row2row2row2
HTML
THHeader
THHeader
THHeader
TFfoot
TFfoot
TFfoot
row1
row1
row1
CSS
table.TB_COLLAPSE{
width:100%;
border-collapse:collapse;
}
table.TB_COLLAPSEcaption{
padding:10px;
font-size:24px;
background-color:#f3f6f9;
}
table.TB_COLLAPSEtheadth{
padding:5px0px;
color:#fff;
background-color:#915957;
}
table.TB_COLLAPSEtbodytd{
padding:5px0px;
color:#555;
text-align:center;
background-color:#fff;
border-bottom:1pxsolid#915957;
}
table.TB_COLLAPSEtfoottd{
padding:5px0px;
text-align:center;
background-color:#d6d6a5;
}
border-collapse:separate
TableCaptionTB_SEPARATETHHeaderTHHeaderTHHeader
TFfootTFfootTFfoot
row1row1row1
row2row2row2
CSS
table.TB_SEPARATE{
width:100%;
border-collapse:separate;/*邊框沒有合併*/
}
網頁設計CSS常用語法CSS常用語法,文字樣式,外緣及邊界樣式,滑鼠樣式,框線樣式,背景樣式十六進位值色碼-HTML顏色代碼查詢製作網頁時都會用到顏色來強調或做區分,使用顏色代碼來查詢不同顏色的代碼列印網頁的強制換頁方式CSSpage-break透過CSS的page-break-before來處理Html列印時的強制換頁CSS濾鏡效果屬性,CSSFilterJavaScriptsetcssfiltersCSSFilter濾鏡效果調整圖片顏色飽度和顏色偏移或模糊等圖形效果應用CSSTablecellspacing及cellpadding對應屬性(網頁表格)CSSTable表格內的td邊是合併在一起、設置CSS單元格各別的邊線及邊距屬性。row2
row2
row2
CSSlist-style項目樣式範例、自訂標號圖示設定list-style項目的樣式各種形狀的標誌或數字及不同語言的字母樣式CSS邊框border框線樣式Application應用設定元件框線、邊線的樣式、點線、虛線、border-style的預設值為none是沒有邊線樣式JavaScript修改CSS的值(設置讀取CSS)window.getComputedStyle()方法返回該對象所應用的樣式表,並解析所有CSS屬性的值。
CSS選擇器,依元素順序選擇範圍CSS擬類型中特別的結構型選擇器+jQuery運用於版面設計之元素的設計樣式CSSoverflow「溢出邊界範圍」Scroll捲軸呈現方式CSSoverflow屬性顯示內容「溢出邊界範圍」區塊層Scroll捲軸處理方式
電腦繪圖平面設計網頁設計CSS樣式程式語法虛擬主機IIS設計資源軟體・設計討論Apple蘋果電腦(行動裝置)Labs實驗室
網域名稱註冊申請英文網域名稱繳費步驟企業郵件設定e-mail
延伸文章資訊
- 1表格框線 - iT 邦幫忙
表格框線. 當我們寫一個表格希望它有框線時,我們通常會這樣寫 ... 有序清單可透過html使用type屬性來設定樣式,也可使用css(html的style屬性來設樣式。) html:
- 2HTML Table 表格邊框顏色與樣式設計 - Wibibi
HTML Table 表格邊框顏色與樣式可以用css 的border-width、border-color 與border-style 三種屬性來設計,也可以直接使用 c.
- 3[CSS] HTML 畫出粗外框表格的方法(粗框表格) - 精讚
<table> 中和表格寬度有關的屬性有border="數字" ,這屬性設定表格內外全部框線的寬度,預設是0,也就是無框表格。 1. < table border = "2" > ...
- 4HTML&CSS入門:為你的網頁換上精美的表格(Table)樣式
無框線,圓角表格
- 5CSS Table 表格邊框樣式
列出與表格邊框樣式,有關的CSS 屬性, 透過CSS 來制定HTML 表格的樣式, CSS 中的border-collapse, collapse, separate 分別可以設置表格的邊框是否...