如何在背景图像的一部分中设置图像映射? [英] How to set image map in a portion of the background image?

查看:149
本文介绍了如何在背景图像的一部分中设置图像映射?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我知道如何设置前景图像的图像映射。但这一次我想为图像的一部分设置图像映射,它被设置为div的背景图像。我可以这样做。我搜索了一个很多在网上,没有一个解决方案。请帮助。例如,

I know how to set image map for foreground image.But this time I want set image map for a portion of the image,which is set as the background image of a div.How can I do this.I have searched a lot in the web,couldn't got a solution.Please help.For example,

html

<div class="header full" style="background:url('/hdr.jpg';?>) no-repeat; height:492px">

整个图像设置为背景图片,我想点击

The entire image is set as background image,I want to click the Nestle oval portion and will get redirected to some url.

推荐答案

请尝试以下的密码:
使用您的图片并重命名为 test.jpg
请将所有图片都放在同一个文件夹中进行测试,并根据需要更改代码(这只是一个示例)

Please try following code
Use your image and rename as test.jpg please put all are in same folder for testing and change code for your needs (this is just an example)

**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;
    }

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>

这篇关于如何在背景图像的一部分中设置图像映射?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆