华师大WEB讲义第2章.ppt

2.4.1 图像的格式 PNG(Portable Network Graphics)是由 GIF 发展而来的一种卓越的网络图像格式，它是一种自由开放的文件格式，不隶属于任何公司和组织。PNG 采用一种无损压缩的方式，被广泛地应用在互联网中。不过一些版本比较低的 Web 浏览器可能不支持 PNG图像格式，所以在使用这种格式的图像时一定要考虑用户的浏览器版本。 * 第*页 2.4.2 图像标记img 插入图像要使用img标记，并用src属性指定图像所存放的路径。这个路径可以是相对路径，也可以是绝对路径。img标记的常用属性如下表所示。 * 第*页 * 第*页 src 图片的来源，可以使用相对路径和绝对路径，是必选项 width 图片的宽度，单位为像素 height 图片的高度，单位为像素 hspace 图片水平方向与文本之间的空白，单位为像素 vspace 图片垂直方向与文本之间的空白，单位为像素 border 图片边框的厚度，单位为像素 align 图片的对齐方式 alt 当鼠标移动到图片上时显示的提示文字 2.5 表格 2.5.1 基本的表格标记 2.5.2 设置表格的属性 2.5.3 设置跨行、跨列的表格 * 第*页 2.5.1 基本的表格标记 用HTML语言创建表格的方式如下： 创建表格：table…/table 创建表格的标题：caption…/ caption 创建表格的行：tr…/ tr 创建表格的表头：th…/ th 创建表格的单元格：td…/ td * 第*页 表格基本结构如下： table tr td表格的第一行的第一个单元格/td td表格的第一行的第二个单元格/td ... /tr tr td表格的第二行的第一个单元格/td td表格的第二行的第二个单元格/td ... /tr ... /table * 第*页 2.5.2 设置表格的属性 可以通过table标记的下列属性对表格进行设置，如表所示。 * 第*页 * 第*页 align 指定表格在浏览器窗口中的对齐方式 background 为表格设置背景图片 border 指定表格边框的宽度，以像素为单位，默认值为0 bordercolor 指定边框颜色，应与border属性一起使用 bgcolor 指定表格的背景颜色 cellpadding 指定单元格内数据与单元格边框之间的距离，以像素为单位 cellspacing 指定单元格之间的间距，以像素为单位 width 指定表格的宽度，以像素或百分比为单位 2.5.3 设置跨行跨列的表格 在设计网页时，有时需要设置跨行、跨列的表格，即表格中的一个单元格占用多行或者多列。 TD标记的rowspan属性：设置单元格在水平方向上跨越的单元格个数。 TD标记的colspan属性：设置单元格在垂直方向上跨越的单元格个数。 * 第*页 2.6 表单 2.6.1 表单标记form 2.6.2 input标记 2.6.3 select标记 2.6.4 textarea标记 * 第*页 2.6.1 表单标记form form name= method= action= …… 表单元素（如文本框、单选按钮、复选框、 列表框、文本区域等） …… /form * 第*页 2.6.1 表单标记form name：该属性表示表单的名称 method：该属性用来定义提交信息的方式，取值为post或get，默认为get。两者的区别是：使用get方式提交信息时，表单中的信息作为字符串自动附加在URL的后面，会将该URL和后面的参数信息在浏览器的地址栏中显示出来。get方式传输的数据量非常小，一般限制在2KB左右，但执行效率比较高。 * 第*页 2.6.1 表单标记form 使用post方式提交信息时，需要对输入的信息进行包装，存入单独的文件中（不附在URL后面），等待服务器取走，这种方式对信息量没有限制。 action：该属性用来指定处理表单数据的程序文件所在的位置，当单击提交按钮后，就将表单信息提交给该文件进行处理。 * 第*页 2.6.2 input标记 该标记可以在表单中定义单行文本框、单选按钮、复选框等表单元素，基本语法格式如下： input name= type= size= 不同的元素有不同的属性，详细的属性如下表所示。 * 第*页 * 第*页 type 插入表单的元素类型，具体取值如表2-7 name 表单元素的名称 size 单行文本框的长度，取值为数字，表示多少个字符长 maxlength 单行文本框可以输入的最大字符数，取值为数字，表示多少个字符，当大于size的属性值时，用户可以