如何在背景图像的一部分中设置图像映射? [英] How to set image map in a portion of the background image?
问题描述
我知道如何设置前景图像的图像映射。但这一次我想为图像的一部分设置图像映射,它被设置为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=""> </a></div>
<div class="image">
</div>
</div>
这篇关于如何在背景图像的一部分中设置图像映射?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!