iT邦幫忙

第 11 屆 iThome 鐵人賽

DAY 17
0
自我挑戰組

CSS 大全(第四版)閱讀筆記系列 第 17

Day17【主題四:css表格排版】_表格分層 / caption / 表格基本格邊框

  • 分享至 

  • xImage
  •  

一、表格分層

  • CSS定義了六個不同的「分層」,由底而上為:
    1.表格
    2.行群組
    3.行
    4.列群組
    5.列
    6.基本格
  • 表格各個面向的樣式都繪畫在各自屬所的分層

二、caption

  • 一小段說明表格內容的文字
  • 透過caption-side屬性,可以將這個元素放在表格的上方或下方
  • 數值:top | bottom
  • caption能夠計程表格的設定值
  • caption與其他快即元素的樣式設定相同;能夠有內距、邊框、指定背景顏色等等。

三、表格基本格邊框

  • 透過border-collapse屬性選擇使用的邊框模型
  • 數值 collapse | separate | inherit
  • collapse使用重疊邊框模型(預設值)
  • separate使用分離邊框模型

3-1.分離基本格邊框

  • 基本格彼此分離一定的距離、邊框不會重疊。
  • border-spacing屬性設置邊框間距。是HTML cellspacing的加強版。
  • empty-cells屬性決定如何處理空的基本格,數值:show | hide

3-2.重疊基本格邊框

  • 基本格彼此間沒有空隙,相鄰的邊框會重疊。
  • 表格外側的邊框與相鄰基本格邊緣不會有任何分隔。

上一篇
Day16【主題四:css表格排版】_表格display值
下一篇
Day18【主題四:css表格排版】_表格尺寸 / 延伸閱讀
系列文
CSS 大全(第四版)閱讀筆記30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言