下面我们以Dreamweaver MX和FrontPage 2003为例，来看看网页图片热区的具体建立过程。
一、在Dreamweaver MX中为图片建立热区 http://www.dw8.org Dreamweaver 专业网站
1、启动Dreamweaver MX（其他版本请仿照操作），打开需要建立图片热区的网页文件，选中相应的图片，此时“属性”面板自动切换到“图片属性”状态（如图1）。 http://www.dw8.org Dreamweaver cs3 专业网站
2、选中一种热区类型（如“椭圆”），然后在图片上拖来出一个热区来（参见图1）
http://www.dw8.org dw专业网站
图1 http://www.dw8.org Dreamweaver cs3 专业网站
注意：热区相当于是在图片上增加了一个图形层，象调整图片一样，可以通过鼠标调整热区的大小和位置。
3、在“链接”右边的方框中输入要链接的网址（如“http://www.yesky.com”）；在“替代”后面的方框中输入一些说明字符（如“天极网”）；按“目标”右边的下拉按钮，在随后出现的下拉列表中选择一种链接页面的打开方式（如需要让链接的页面在新窗口中打开，就选择“_blank”选项）。
http://www.dw8.org Dreamweaver 专业网站
注意：“替代”方框中输入的字符，在以后浏览网页时，当鼠标指向该热区时，在页面上会显示出该字符（如图2）。 http://www.dw8.org Dreamweaver cs3 专业网站
图2
http://www.dw8.org Dreamweaver 专业网站
4、重复上述2、3步的操作，在图片的不同部位建立多个热区。
二、在FrontPage2003中为图片建立热区 http://www.dw8.org Dreamweaver 专业网站
1、启动FrontPage2003，打开需要建立图片热区的网页文件。
2、执行“视图→工具栏→图片”命令，展开“图片”工具栏（如图3） http://www.dw8.org Dreamweaver 专业网站
图3 http://www.dw8.org dw专业网站
3、选中一种热区类型（如“长方形”），然后在图片上拖来出一个热区，此时系统自动弹出“插入超链接”对话框（如图4）。
http://www.dw8.org Dreamweaver cs3 专业网站
图4
http://www.dw8.org Dreamweaver cs3 专业网站
4、在“地址”栏上输入要链接的网址（如“www.yesky.com”）；点击“屏幕提示”按钮打开“设置屏幕超链接提示”对话框（如图5），输入一些说明字符（如“天极网”）。
图5 http://www.dw8.org Dreamweaver 专业网站
注意：此处的“屏幕提示”同Dreamweaver MX“替代”功能一样。 http://www.dw8.org Dreamweaver cs3 专业网站
4、同理，重复上述3、4步的操作，可以在图片的不同部位建立多个热区。
http://www.dw8.org Dreamweaver 专业网站