在github readme.md文件中使用图像映射

Question

是否有任何选项可以在readme.md文件中包含图像，该文件具有usemap属性？

纯HTML将是

<img src="myimage.png" usemap="#mymap"/>
<map name="mymap">
  <area coords="1,1,40,40" href="mylink.html"/>
</map>

我出于多种原因无法工作

• usemap保留为属性，但删除了map-block。因为map-tag不在html白名单上，如果我没有记错的话，就不足为奇了。
• 图片地图不能在锚标记内，但github markdown会将其渲染为 指向原始文件位置的a-tag和里面的img-tag。

我没有看到任何选项，是吗？

Answer 1

好的，有点使用CSS的解决方案和建议，而不是img的usemap属性。

我想出的最好的答案是使用github页面 - 这些是由github托管的静态网页，因此你可以在那里做你想做的一切。

https://help.github.com/articles/creating-a-github-pages-site-with-the-jekyll-theme-chooser/

这会创建一个新的分支gh-pages，并且只使用那些html文件。非常方便，因为您无需登录主分支进行更改。

endresult不是README.MD文件中的图像映射，但是我添加了一个指向使用imagemap的github-pages index.html的链接。 imagemap指向各种github资源。所以不要在README.MD中内联，只需点击一下即可。

第二个发现：不要使用图像映射而是使用CSS。 Imagemap坐标取决于浏览器渲染的图像宽度，而不取决于图像本身的宽度。与github一样，标准是使用max-width样式属性，图像通常会缩小 - 而imagemap的坐标则不是。

使用CSS更好 - 请参阅＆＃34;响应式图像映射＆＃34; - 和百分比值。

table.html

作为两者，图像和锚标记位于相对位置的块元素内，锚标记位于绝对位置，锚位置随图像缩放。