在網頁中,表格是一種經常使用的元素。CSS3表格的代碼可以讓我們創建漂亮的表格,通過樣式來改變表格的外觀和樣式。
//創建表格的基本樣式 table{ border-collapse: collapse; //合并邊框 width: 100%; //寬度100% background-color: #f2f2f2; //背景色 } td, th{ border: 1px solid #ddd; //邊框樣式 padding: 8px; //內容的內邊距 text-align: left; //文本對齊方式 } th{ background-color: #4CAF50; //表頭背景色 color: white; //表頭文字顏色 } //鼠標移到表格行時變色 tr:hover{ background-color: #f5f5f5; } //為偶數行添加背景色 tr:nth-child(even){ background-color: #f2f2f2; }
這些CSS3的代碼可以讓我們自定義表格的樣式,其中包括設置邊框、內邊距、對齊方式等,也可以添加不同的顏色和背景色。在鼠標移到表格行時,我們可以讓其變色,同時也可以為偶數行添加不同的背景色。通過以上的CSS3表格代碼示例,我們可以輕易地構建一個漂亮的表格,并使其更加符合我們的需求和風格。
上一篇不隱藏塊css