任务二网站主页面布局设计与制作.pptVIP

3．链接标签 表3-3给出了链接标签的说明。 a href=URL地址/a 创建一个超链接 a href=mailto:EMAIL/a 创建一个电子邮件的链接 a name=NAME/a 创建一个位于文档内部的链接 a href=#NAME/a 创建一个锚链接 表3-3 链接标签说明 4．图像标签 表3-4列出了图像标签的说明。 img src=name 添加一个图像 img src=name align= left、center、right 排列对齐一个图像：左中右或上中下 img src=name border=数值 设置围绕一个图像的边框大小 hr 加入一条水平线 hr size=数值 设置水平线的大小 hr width=数值 设置水平线的宽度（百分比或绝对像素点） hr noshade 创建一个没有阴影的水平线 表3-4 图像标签说明 5．表格标签 表3-5列出了表格标签的说明。 table/table 创建一个表格 tr/tr 单元行 td/td 单元格 th/th 设置表格头（标题）：一个通常使用黑体居中文字的格子 table border=数值 设置围绕表格边框的宽度 table cellspacing=数值 设置表格单元格之间的空间大小 table cellpadding=数值 设置单元格边框与其内部内容之间空间的大小 table width=数值or % 设置表格的宽度（用绝对像素值或文档总宽度的百分比） tr align= left、center、right or td align= left、center、right 设置表格格子的水平对齐（左中右） tr valign=? or td valign=? 设置表格格子的垂直对齐（上中下） 表3-5 表格标签说明 添加超级链接 1．什么是超级链接 （1）绝对链接 绝对链接是一种指向某个页面精确位置的超级链接。 （2）相对链接 相对链接是从当前页面位置出发指向目的页面位置的路径。 2．超级链接的实现 （1）文字或图像链接 （2）热区链接 （3）锚链接 （4）E-mail链接 （5）空链接 任务2-4:用photoshop或进行主页效果图的制作 网页图片基础知识 编辑图片文件 辅助绘图工具 设置颜色 网页图片基础知识 1、矢量图和位图 2、颜色模式 编辑图片文件 1、新建网页图片文件 2、保存网页图片文件 3、打开网页图片 辅助绘图工具 1、使用标尺 2、使用参考线 3、使用矩形工具 4、使用直线工具 5、使用单行（列）选框工具 设置颜色 1、设置前景色和背景色 2、使用油漆桶工具 3、使用渐变工具 实例-设置网页图片 步骤： 1、启动photoshop 2、打开“新建”对话框 3、设置前景色，使用渐变工具 4、使用标尺和参考线 5、绘制矩形、保存图片 练习 步骤： 1、打开已有的图片文件tigao.psd 2、设置前景色为蓝色 3、绘制矩形 4、设置前景色为黄色 5、绘制4个矩形 6、保存图片文件 任务2-5:网页内容排版 表格的一般应用 表格的特殊效果 利用表格设计页面布局 利用表格搭建页面实例 表格的一般应用 表格在网页设计中的地位非常重要，主要表现在网页定位上。 先介绍一下表格的标记。当我们在页面中插入一个表格后，可以在下面的标签提示区看到tabletrthtd等标签，如图4-1所示。 图 表格的标签 表格的标签是table，一个表格由table开始到/table结束；tr说明表格的单元行，表有多少行就有多少个tr；th说明表格的列数和相应栏目的名称，有多少个栏就有多少个th；td是单元格，它是组成表格的最根本元素。 置入表格 表格的属性 1．表格的一般属性 （1）表格的属性是由宽（width）=“像素或者百分比”和高（height）=“像素或者百分比”说明的。 （2）表格边框的宽度（border）=“像素”，“像素”为宽度值。 （3）表格边框的颜色（bordercolor）=“16进制的6位数”，格式为RGB，分别表示红、绿、兰。 2．表格的对齐属性 （1）将整个表格居中 （2）单元格中元素的水平对齐 （3）单元格中元素的垂直对齐 3．表格、单元格中背景颜色、背景图属性 （1）给整个表格添加背景色 （2）给单元格添加背景色或背景图 4．单元格之间的空隙属性 5．单元格内容与单元格边界间的距离 表格的拆分与合并 表格的特殊效果 一个像素宽的分隔线 制作细线表格 制作另一种细线表格 制作圆角表格 表格制作中的问题