资讯专栏INFORMATION COLUMN

python大佬养成计划----HTML网页设计(表格)

LittleLiByte / 1706人阅读

摘要:用于表示一行的开始和结束用来表示行中个单元格的开始和结束。通过可以调整文字与边框之间的距离文字与边框的距离表格中单元格之间的距离表格中单元格之间的距离也可以变化。

制作网页时,要合理规划网页布局。比如,在网页中添加一个表格,可分为上、中、下三部分,上部存放网页标题或LOGO图片,中间部分是整个网页的主体内容,底部就是相关制作信息。此外,单元格里还可再添加单元格,将内容分类别、分层次合理规划。

表格标签--table

是一个双标签。一个表格中包含

、、表格边框--border

默认情况下,表格不显示边框。为了更好的区分内容,可以设置表格边框宽度大小,

三个基本元素。首标签和尾标签
表示一个表格的开始和结束。"tr=table row"用于表示一行的开始和结束,"td=table data"用来表示行中个单元格的开始和结束。


...
单元格内容 单元格内容
单元格内容 单元格内容
表格的标题--caption

有一种特殊的单元格叫做标题单元格,位于表格的第一行,标题单元格是没有边框的,默认居中显示。

表格的标题
表格内文字与边框的距离--cellpadding

默认情况下,文字紧贴边框。通过cellpadding可以调整文字与边框之间的距离

表格中单元格之间的距离--cellspacing

表格中单元格之间的距离也可以变化。

单元格背景图像--background



    
    小白


默认情况下的表格
亚洲
中国 北京 1949年10月1日
缅甸 内比都 1948年1月4日

设置属性后的表格
亚洲
中国 北京 1949年10月1日
缅甸 内比都 1948年1月4日

行合并属性--rowspan

在制作一些复杂的表格时,需要用到单元格合并





    
    单元格行合并


招生简章
基础科目 数学
外语
政治
专业课 100

列合并属性--colspan

在制作一些复杂的表格时,需要用到单元格合并





    
    单元格列合并


西安
长安区 雁塔区 碑林区
新城区 高新区 莲湖区

表格的嵌套

一个表格内部包含其他标签,用表格来排版页面,可以使页面各个部分互不冲突,整体结构优美。




    
    表格嵌套


示例
昙花
浏览器 百度
百度贴吧 百度网盘 百度图库

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

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

相关文章

  • python大佬养成计划----HTML网页设计表格

    摘要:用于表示一行的开始和结束用来表示行中个单元格的开始和结束。通过可以调整文字与边框之间的距离文字与边框的距离表格中单元格之间的距离表格中单元格之间的距离也可以变化。 制作网页时,要合理规划网页布局。比如,在网页中添加一个表格,可分为上、中、下三部分,上部存放网页标题或LOGO图片,中间部分是整个网页的主体内容,底部就是相关制作信息。此外,单元格里还可再添加单元格,将内容分类别、分层次合理...

    张巨伟 评论0 收藏0
  • python大佬养成计划----HTML网页设计表格

    摘要:用于表示一行的开始和结束用来表示行中个单元格的开始和结束。通过可以调整文字与边框之间的距离文字与边框的距离表格中单元格之间的距离表格中单元格之间的距离也可以变化。 制作网页时,要合理规划网页布局。比如,在网页中添加一个表格,可分为上、中、下三部分,上部存放网页标题或LOGO图片,中间部分是整个网页的主体内容,底部就是相关制作信息。此外,单元格里还可再添加单元格,将内容分类别、分层次合理...

    jasperyang 评论0 收藏0
  • python大佬养成计划----JavaScript对html的优化

    摘要:实现用鼠标点击下一页时,更换图片的功能。表格全选依次遍历所有的单选框,设置状态为选中如果状态为未选中,则设置所有的单选框为未选中状态依次遍历所有的单选框,设置状态为选中添加删除编号姓名性别年龄 切换图片 当我们浏览网页时,时常出现图片轮播场景。实现用鼠标点击‘下一页’时,更换图片的功能。 #当前目录下建立img目录,存放图片,图片命名格式img1.jpg 图片切...

    Lowky 评论0 收藏0
  • python大佬养成计划----CSS样式类

    摘要:与类选择器一样,选择器中可以忽略通配选择器。是唯一标识,只能被使用一次选择器标签选择器标签选择器使用类选择器选择器标签选择器设置链接的样式能够设置链接样式的属性有很多种例如等等。 CSS 概述 CSS 指层叠样式表 (Cascading Style Sheets) 样式定义如何显示 HTML 元素 样式通常存储在样式表中 把样式添加到 HTML 4.0 中,是为了解决内容与表现分离的问...

    daryl 评论0 收藏0
  • python大佬养成计划----CSS样式类

    摘要:与类选择器一样,选择器中可以忽略通配选择器。是唯一标识,只能被使用一次选择器标签选择器标签选择器使用类选择器选择器标签选择器设置链接的样式能够设置链接样式的属性有很多种例如等等。 CSS 概述 CSS 指层叠样式表 (Cascading Style Sheets) 样式定义如何显示 HTML 元素 样式通常存储在样式表中 把样式添加到 HTML 4.0 中,是为了解决内容与表现分离的问...

    Steve_Wang_ 评论0 收藏0

发表评论

0条评论

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