Php 如何在背景图像的一部分中设置图像贴图？_Php_Html_Css_Imagemap

Php 如何在背景图像的一部分中设置图像贴图？

php html css

Php 如何在背景图像的一部分中设置图像贴图？,php,html,css,imagemap,Php,Html,Css,Imagemap,我知道如何为前景图像设置图像映射。但这次我想为图像的一部分设置图像映射，该部分图像被设置为div的背景图像。我该如何做。我在web上搜索了很多，找不到解决方案。请帮助。例如 html 整个图像被设置为背景图像，我想单击雀巢的椭圆形部分，并将被重定向到某个url。下面是一个示例，并有说明：请尝试以下代码使用您的图像并重命名为test.jpg 请将所有代码放在同一个文件夹中，以便根据您的需要测试和更改代码（这只是一个示例） HTML <head> <link rel="st

我知道如何为前景图像设置图像映射。但这次我想为图像的一部分设置图像映射，该部分图像被设置为div的背景图像。我该如何做。我在web上搜索了很多，找不到解决方案。请帮助。例如

html

整个图像被设置为背景图像，我想单击雀巢的椭圆形部分，并将被重定向到某个url。

下面是一个示例，并有说明：

请尝试以下代码
使用您的图像并重命名为test.jpg 请将所有代码放在同一个文件夹中，以便根据您的需要测试和更改代码（这只是一个示例）

HTML

<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div class="container">
<div class="link"> <a href="">&nbsp;</a></div>
<div class="image">
</div>
</div>

好的你把图像作为背景由于他们的原因，现在在div中没有这样的元素可以单击

如果图像映射中的链接只需要“矩形”形状，则可以使用css定义的链接位置。这是通过指定位置并将背景色设置为透明来实现的

您是否有任何代码要显示？请发布一些代码、图形或JSFIDLE来澄清您的问题

**CSS** (style.css)



.image{
   background: url("test.jpg") repeat scroll 0 0 transparent;
   height: 185px;
   width: 266px;
   border: 1px solid;
   }
    .link{
        padding-left: 26px;
        padding-top: 23px;
        position: absolute;
    }
    .link a{
      padding-left: 0;
      display: block;
      height: 48px;
      width: 67px;
    }
    .container{
    position: relative;
    }

<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div class="container">
<div class="link"> <a href="">&nbsp;</a></div>
<div class="image">
</div>
</div>