HTML表格、框架使用大全.ppt
《HTML表格、框架使用大全.ppt》由会员分享,可在线阅读,更多相关《HTML表格、框架使用大全.ppt(65页珍藏版)》请在三一文库上搜索。
1、,静态网站设计,网络技术系:李毓丽,使用表格,制作表格添加或删除行和列格式化表格为表格添加题注嵌套表格,表格在网页中除了作为一个显示对象以外,还有一个重要的作用就是用于排版页面内容,制作表格,表格标记,基本语法, ,与标记不同的地方是之间的内容会加粗且默认居中显示,而之间的内容则不加粗且默认居左显示,表格示例,表格中每一行使用一个表示;行中的每一列使用一个或表示添加或删除行和列可以分别通过添加或删除行和列标记来实现,添加或删除行和列,添加或删除行和列实现方法,添加新行 可以通过插入额外的 和 标记来添加新的一行在表内创建新列 可以通过对每一行添加 或 标记在表格中创建新的列删除表中的行和列 可
2、以通过删除包围指定行和列的 标记和 标记来删除表格中的列和行,表格的格式化包括以下一些内容:为表格添加边框及设置边框粗细及边框颜色为表格添加背景图像或背景颜色指定表格的对齐方式设置表格的宽度、高度设置表格单元格内容与边框的间距及单元格之间的间距指定行、列的背景图像或背景颜色指定行、列内容的对齐方式设置行、列的边框颜色设置行、列的宽度和高度单元格的跨行和跨列设置,格式化表格,表格属性,表格标记属性设置语法,表格标记属性示例,示例代码,行标记属性,行标记属性设置语法,行标记属性示例,、标记属性,单元格宽度属性解释,如果没有设置单元格宽度,则浏览器将会根据单元格中的内容来自动调整单元格的宽度如果设置
3、了单元格宽度,但没有设置nowarp属性,则单元格中的内容在超出了单元格宽度设置允许的情况下自动对文本进行换行显示如果设置了单元格宽度,但同时又设置了nowarp属性,则此时,单元格宽度设置不起作用,所有文本将在一行内显示,单元格标记属性设置语法,单元格标记属性示例,表格各标记属性设置的注意事项,表格标记中的bordercolorlight、bordercolordark颜色显示的位置正好跟行标记及单元格标记中的这两个属性相反 内层的边框颜色设置会和外层的边框颜色混合成另一种颜色同时设置背景颜色和背景图像时,背景颜色将被背景图像覆盖掉只有较新版的浏览器才支持背景颜色和背景图像的设置,不支持背景
4、图像的设置的浏览器会显示浏览器的默认背景颜色来代替图像,背景图像属性设置的规则,选择基本上不传达信息的小巧而精致的图像选择带有较少形状、模式或颜色的简单图像 选择能够突出文档意图的图像在尽可能多的浏览器中查看带有表格背景图像的HTML文档,确保跨浏览器的兼容性,背景颜色属性设置的规则,如果文本颜色是深色的,应该选择浅色作为背景颜色如果文本颜色是浅色的,应该选择深色作为背景颜色选择在美学角度来看令人愉快的颜色如果表述的主题是快节奏或激动人心的,应该选择明快的颜色如果表述的是慢节奏和基调忧郁的内容,应该选择暗淡的颜色始终选择216 种无抖动颜色之一,表格题注作用:概括表格的内容提供关于表格内容的一
5、些信息基本语法 语法解释 标记之间的就是表格的标题,这个标记必须在标记对之内使用,为表格添加题注,标记对齐属性,表格题注设置示例,在网页中,排版通常需要通过表格的嵌套来完成表格的嵌套是指在一个表格的单元格中插入另一个表格,嵌套表格,表格嵌套设置示例,在网页排版中使用嵌套表格的原因有二:一是利于简化表格制作:网页的排版有时会很复杂,在外部需要有一个表格控制总体布局,如果这时一些内部排版的细节也通过总表格来实现,容易引起行高列宽等的冲突,给表格制作带来困难二是提高浏览器响应速度:浏览器在解析网页的时候,是将整个表格的结构下载完毕之后才显示表格,如果不使用嵌套,表格非常复杂,表格下载耗时相对长,浏览
6、者要等很长时间才能看到网页的内容,小 结,制作表格时需要同时使用或标记对表格的内容必须放置在或之间每一行必须使用一个标记对行中的所有列都必须放置在标记对之间通过表格、行及单元格标记的属性,可以对表格进行格式化,如设置显示边框、边框宽度、边框颜色等,在排版网页时通常需要嵌套表格,所谓表格的嵌套,是指在一个表格的单元格中插入另一个表格,小 结,思考题,1. 在显示表格边框,应如何设置?2. 如何设置表格的宽度、高度、对齐方式、边框颜色、单元格间距及单元格边距? 3. 如何设置单元格的对齐方式、背景颜色、背景图像?4. 在网页排版时,应如何嵌套表格?,使用框架结构,框架概述框架结构组成标记框架集标记
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- HTML 表格 框架 使用 大全
链接地址:https://www.31doc.com/p-13142768.html