css - 需要对 map 内的区域标签进行样式化

标签 css

我的图像和区域位于内部

<map name="number_areas">
    <area href="#" shape="poly" coords="190,1,285,1,285,95,190,94" id="area6">
    ....

有没有办法为区域标签设置CSS样式,如背景、透明度等?

最佳答案

无法使用 css 直接更改指定区域的样式。
另一种方法是使用 SVG 文件

这是我编写的一个示例:JSFIDDLE

在示例中,您有这个 css,可以为您的 svg 创建样式:

polygon.hoverable
{
    fill: transparent;
    stroke:gray; /* Replace with none if you like */
    stroke-width: 4;
    cursor: pointer;
}

polygon.hoverable:hover
{
 stroke:black;   
}

另一种方法是在 javascript/jQuery 中使用一些插件,如下所示:

ImageMapster

关于css - 需要对 map 内的区域标签进行样式化,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33328784/

相关文章:

html - 我无法更改 html 中的段落颜色

javascript - 如何在悬停时为 svg 图像中的笔画设置动画

javascript - 如何在 Angular js中显示行内的行

html - 如何使用html css强制列表垂直

jquery - 如何将 show() 和 hide() jquery 函数应用于 css 显示属性

css - 表单按钮的 div 和 span css 样式

html - 在表格单元格内放置一个文本框,但没有边距和填充。文本框应完全适合单元格

jquery - HTML、CSS、JavaScript 弹出问题

html - 图像按钮导航到另一个站点 html/css

jquery - 用于更改包含 href 的 div 颜色的 CSS