今天没有前言，没有目录。我么直接上干货。
首先我们一定遇到过这样的图片
示例
点击图片红线框住部分，就能跳转到某个地方的超链接。我们都知道在img标签外套一个a标签可以实现点击图片跳转的效果。但是往往我只需要图片里的部分能够点击跳转。就比如图中，我们点击马上认证可以跳转，点其他地方则没有反应。
如何实现呢？需要一个远古工具，Dreamweaver。现在已经出到2018版本了。之前的版本我没用过。所以本次举例使用最新版 Dreamweaver 2018 CC
首先打开你的html的文件
点击插入
选择插入下拉栏中的Image
选择好图片后，图片就通过img标签自动引入了
自动引入
然后我们点击右上角的设计
点击设计
我们就可以看到图片的预览，还有下方的工具栏（如果没有工具栏，请点击顶部工具栏中的窗口，里面选择属性）
设计界面
我们注意左下角有四个按钮，分别代表我们热力链接的四个工具，大家可以按照自己的需求使用。我就直接使用最简单的矩形工具
点击矩形工具后，在图片中你先要加入热点链接的地方，拉出一个矩形框住
选定热点链接
随后，看下方工具栏，就可以看到添加链接的地方了
添加链接
完成所有的步骤以后我们回来看代码
回到代码
我们就可以看到代码发生了变化
自动修改代码
分别代表什么我就不一一介绍了 ，大家一看就明白了。这里有几处小细节
- 大家通过定义常量的方式替代部分路径比如：__ STATIC__这样的方式，在Dreamweaver里是不生效的。解决方法是，先通过插入图片，将热点链接这些都弄好了之后再把图片的路径改为你需要的路径
- Dreamweaver，默认是不自动保存的，使用phpStrom习惯的朋友，记住要保存哟
好了今天的分享就到这里。内容很简单，主要是分享给对前端的东西不够了解的php后端开发人员，让专业前端见笑了。有什么不对的地方欢迎大神指正。大家共同学习。
网友评论