时间戳

首页 > 解决方案 > 当以电子邮件形式发送并更改缩放（100% 缩放不起作用）时，如何修复 HTML 的 ImageMap 链接？

html - 当以电子邮件形式发送并更改缩放（100% 缩放不起作用）时，如何修复 HTML 的 ImageMap 链接？

问题描述

我是一名电子营销人员，因此，我必须在我的电子邮件中发送以下 HTML 以作为页眉和页脚。我为此做了一个图像映射，当我在 Outlook 上放大/缩小（100% 搞砸了）时，链接变得搞砸了。如果图像映射不起作用，是否有另一种方法可以链接标题中的图标？页眉的 图像 页脚的图像

<!-- Header Start -->

<div align="center">
<img src="https://www.cisofficeplus.ca/Maestro/2020Emails/Templates/2021_eblastTemplates_Header.jpg" usemap="#image-map" >


<map name="image-map">
    <table> 
    <tr>
    <td>
    <area target="" alt="Card" title="Card" href="https://corbettoffice.com/" coords="5,5,634,125" shape="rect"></td><td>
    <area target="" alt="Monthly Flyer" title="Monthly Flyer" href="https://corbettoffice.com/content.aspx?l=0,1,782,811" coords="639,5,898,124" shape="rect"></td><td>
    <area target="" alt="Furniture" title="Furniture" href="https://corbettoffice.com/search.aspx?q=furniture" coords="284,162,25" shape="circle"></td><td>
    <area target="" alt="Workplace Wellness" title="Workplace Wellness" href="http://work-well.ca/index.asp?mn=240&amp;utm_source=remarkety&amp;utm_medium=email&amp;utm_campaign=Corbett+J+-+Week+2A-+December+8%2C+2020_1_2&amp;_rmId=W7JpEb6rjPtw7OEoZrL6Iw9E1" coords="351,161,26" shape="circle"></td><td>
    <area target="" alt="Technology" title="Technology" href="https://corbettoffice.com/search.aspx?q=technology" coords="418,162,26" shape="circle"></td><td>
    <area target="" alt="Office Supplies" title="Office Supplies" href="https://corbettoffice.com/search.aspx?q=office+supplies" coords="485,161,25" shape="circle"></td><td>
    <area target="" alt="Arts" title="Arts" href="https://corbettoffice.com/search.aspx?q=art" coords="552,161,26" shape="circle"></td><td>
    <area target="" alt="Facility and Breakroom" title="Facility and Breakroom" href="https://corbettoffice.com/search.aspx?q=cleaning+supplies" coords="620,161,25" shape="circle"></td>
    </tr>
    </table>
</map>
</div>
<!-- Header Finish-->



<!-- Footer Start -->
<div align="center">
<img src="https://www.cisofficeplus.ca/Maestro/2020Emails/Templates/2021_eblastTemplates_Footer.jpg" usemap="#image-map2">

<map name="image-map2">
    <area target="" alt="Contact Us" title="Contact Us" href="https://corbettoffice.com/contact-us.aspx" coords="12,20,89,53" shape="rect">
    <area target="" alt="Privacy Policy" title="Privacy Policy" href="" coords="100,22,184,52" shape="rect">
    <area target="" alt="Facebook" title="Facebook" href="https://www.facebook.com/CorbettOP" coords="286,19,329,60" shape="rect">
    <area target="" alt="Twitter" title="Twitter" href="https://twitter.com/OffcePls" coords="335,20,377,59" shape="rect">
    <area target="" alt="Pinterest" title="Pinterest" href="https://www.pinterest.com/OffcePls/" coords="426,59,383,20" shape="rect">
    <area target="" alt="Youtube" title="Youtube" href="https://www.youtube.com/OfficePlusSimplyMore" coords="472,19,431,58" shape="rect">
    <area target="" alt="Blog" title="Blog" href="https://blog.office-plus.ca" coords="518,19,478,57" shape="rect">
    <area target="" alt="Instantgram" title="Instantgram" href="" coords="565,19,525,58" shape="rect">
    <area target="" alt="Linkedin" title="Linkedin" href="" coords="614,19,571,58" shape="rect">
    <area target="" alt="WorkplaceWellness" title="WorkplaceWellness" href="http://www.work-well.ca/index.asp?mn=240" coords="738,74,891,5" shape="rect">
</map>

<div>
<!-- Footer Finish-->

标签： htmlcssimagemap

解决方案

推荐阅读