资讯专栏INFORMATION COLUMN

构建静态页面 之 [ 表格 ]

raoyi / 1663人阅读

摘要:表格描述以网格的形式来呈现数据,并且以二维数据表有行有列来显示数据内容表格元素元素表示定义表格元素表示定义表格中的行元素表示定义表格中的表头元素表示定义表格中的单元格元素表示定义表格中的标题元素表示定义表格的页眉元素表示定义表

表格 描述

以网格的形式来呈现数据,并且以二维数据表(有行有列)来显示数据内容

表格元素

元素 - 表示定义表格

元素 - 表示定义表格中的行

元素 - 表示定义表格的页眉

元素 - 表示定义表格的主体

元素 - 表示表格的页脚

表格元素元素属性border属性

表示设置表格的边框

属性值为数字值

会同时设置表格和单元格

rowspan属性

表示设置单元格的跨行

属性值为数字值

colspan属性

表示设置单元格的跨列

属性值为数字值

表格元素整体示例代码




元素 - 表示定义表格中的表头

元素 - 表示定义表格中的单元格

元素 - 表示定义表格中的标题

随身物品
手机 电脑 手表 平板
iphone X MacBook Pro 15寸 卡西欧 iPad Pro 12寸
iphone SE MacBook Pro 13寸 尼尚 iPad Pro 10寸
以上二选一
表格样式 caption-side属性

表示设置表格中的标题元素在表格中的显示位置

border属性

表示设置边框

border-width - 表示设置边框的宽度

border-style - 表示设置边框的样式

border-color - 表示设置边框的颜色

border属性也允许简写:顺序是 边框的宽度 边框的样式 边框的颜色

border-collapse属性

表示设置边框是分离还是合并

注意:在设置边框为合并后,border-spacing属性和empty-cells属性会失效

border-spacing属性

表示设置边框之间的距离

empty-cells属性

表示设置空白单元格的显示与隐藏

表格样式示例代码

    
    表格的样式
    


随身物品
手机 电脑 手表 平板
iphone X MacBook Pro 15寸 卡西欧 iPad Pro 12寸
iphone SE MacBook Pro 13寸 尼尚 iPad Pro 10寸
以上二选一

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/52928.html

相关文章

  • 构建静态页面 [ 表格 ]

    摘要:表格描述以网格的形式来呈现数据,并且以二维数据表有行有列来显示数据内容表格元素元素表示定义表格元素表示定义表格中的行元素表示定义表格中的表头元素表示定义表格中的单元格元素表示定义表格中的标题元素表示定义表格的页眉元素表示定义表 表格 描述 以网格的形式来呈现数据,并且以二维数据表(有行有列)来显示数据内容 表格元素 元素 - 表示定义表格 元素 - 表示定义表格中的行 元素 -...

    李昌杰 评论0 收藏0
  • 构建静态页面 [ 布局 ]

    摘要:布局描述表示对页面中的显示效果进行一些排列水平方向居中垂直方向居中居中布局水平方向居中第一种方式水平居中行内块级元素水平居中的第一种方法该方法需作用在父子结构中为父级设置属性为子级设置属性注意的问题属性是设置文本内容对齐方式的 布局 描述 表示对页面中的显示效果进行一些排列 水平方向居中 垂直方向居中 居中布局 水平方向居中 第一种方式 水平居中 + 行内块级元素(text-a...

    andot 评论0 收藏0
  • 构建静态页面 [ 布局 ]

    摘要:布局描述表示对页面中的显示效果进行一些排列水平方向居中垂直方向居中居中布局水平方向居中第一种方式水平居中行内块级元素水平居中的第一种方法该方法需作用在父子结构中为父级设置属性为子级设置属性注意的问题属性是设置文本内容对齐方式的 布局 描述 表示对页面中的显示效果进行一些排列 水平方向居中 垂直方向居中 居中布局 水平方向居中 第一种方式 水平居中 + 行内块级元素(text-a...

    JessYanCoding 评论0 收藏0
  • 静态页面架构】CSS表格

    摘要:架构表格元素表格的基本结构以元素建立表格元素是表格行,元素是表示表格单元格表格以行和列表示容器元素属性默认的表格和单元格都有边框表格默认是有宽度的单元格之和决定元素表示表格中的单元格单元格默认宽度由内容决定姓名年龄职业桐人 CSS架构 表格: 1.元素: 表格的基本结构;以table元素建立表格tr元素是表格行,td元素是表示表格单元格 ...

    instein 评论0 收藏0
  • 支持多框架的组件库KPC 1.0正式发布

    摘要:自从年月份对外公布以来,已经经过了个月的迭代,期间发布了几十个正式版本,但一直没有到,因为我们觉得是个里程碑版本,我们必须做的足够完善才敢称之为。 自从17年11月份对外公布以来,KPC已经经过了8个月的迭代,期间发布了几十个正式版本,但一直没有到1.0,因为我们觉得1.0是个里程碑版本,我们必须做的足够完善才敢称之为1.0。而如今我们有信心对外宣布:KPC 1.0终于来了! 其实距离...

    刘厚水 评论0 收藏0

发表评论

0条评论

raoyi

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<