每张图片右下角弄个链接

xniob 2008-04-09 02:08:19

我想在每张图片的右下角弄个图片链接(比如像阿里妈妈广告一样,右下角有个阿里妈妈提供的链接)

下面是阿里妈妈广告的代码中分析出来的
不过他高度宽度都定死了(我会改可是图片不确定位置,)

<div><img src="logo.jpg" width="190" height="60" />

<a id="icon" title="查看广告位信息" target="_blank" href="http://baidu.com" style="width:30px;height:13px;left:170px;top:58px;display:block;position:absolute;cursor:pointer;z-index:250;"><div style="font-size:1px;position:absolute;z-index:1;height:17px;width:30px;top:0px;left:0px;background-color:#000000;opacity:0.25;filter:Alpha(opacity=25);"></div><div style="background-repeat:no-repeat;font-size:1px;position:absolute;z-index:2;height:13px;width:30px;top:0px;left:0px;background-image: url(ad.gif);*background-image:none;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='ad.gif');"></div></a>

</div>

上面还透明的,背景

我只要实现网页上指定图片右下角弄个图片链接就行
不知道div如何实现

...全文

121 9 打赏收藏转发到动态举报

写回复

用AI写文章

9 条回复

切换为时间正序

请发表友善的回复…

发表回复

mickeyliu82 2008-04-15

打赏
举报



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>test</title>

<style>

.picbox{position:relative;background-color:#000033;width:180px;height:100px;}

.picbox img{width:180px;height:100px;}

.picbox .cornerlink{position:absolute;right:4px;bottom:4px;font-size:12px;}

</style>

</head>



<body>

<div class="picbox"><img src="logo.jpg"/>

<a class="cornerlink" title="..."  href="#">点我看看</a>

<br style="clear:both" />

</div>

</body>

</html>

lekaishiwo 2008-04-13

打赏
举报

您能在仔细的解释一下吗？谢谢!!!

wenrooroo 2008-04-11

打赏
举报

A移出来，并列原来包裹的DIV再给属性 position: absolute;

wdswei 2008-04-09

打赏
举报

可以用两个DIV，右下角那个设置Z-index为1,用另一个显示图片

xniob 2008-04-09

打赏
举报

我的意思是图片(1)右下角上加张图片(2),图片2链接指向http://sexmovie.com

wolfgang_l 2008-04-09

打赏
举报

图片高度宽度怎么能不确定呢？动态的？我看你顶楼的例子里面明显是一个静态的图片地址啊。

另外，Map的位置是相对位置，知道图片大小就可以。

xniob 2008-04-09

打赏
举报

但图片高度宽度都不确定,图片在网页哪个位置也不知道啊

wolfgang_l 2008-04-09

打赏
举报

引用DHTML手册里面的例子:

<P><IMG SRC="solarsys.gif" WIDTH=504 HEIGHT=126 BORDER=0
ALT="太阳系" USEMAP="#SystemMap">
<MAP NAME="SystemMap">
<AREA SHAPE="rect" COORDS="0,0,82,126"
HREF="/workshop/graphics/sun.gif">
<AREA SHAPE="circle" COORDS="90,58,3"
HREF="/workshop/graphics/merglobe.gif">
<AREA SHAPE="circle" COORDS="124,58,8"
HREF="/workshop/graphics/venglobe.gif">
<AREA SHAPE="circle" COORDS="162,58,10"
HREF="/workshop/graphics/earglobe.gif">
<AREA SHAPE="circle" COORDS="203,58,8"
HREF="/workshop/graphics/marglobe.gif">
<AREA SHAPE="poly" COORDS="221,34,238,37,257,32,278,44,284,60,
281,75,288,91,267,87,253,89,237,81,229,64,228,54"
HREF="/workshop/graphics/jupglobe.gif">
<AREA SHAPE="poly" COORDS="288,19,316,39,330,37,348,47,351,66,
349,74,367,105,337,85,324,85,307,77,303,60,307,50"
HREF="/workshop/graphics/satglobe.gif">
<AREA SHAPE="poly" COORDS="405,39,408,50,411,57,410,71,404,78,
393,80,383,86,381,75,376,69,376,56,380,48,393,44"
HREF="/workshop/graphics/uraglobe.gif">
<AREA SHAPE="poly" COORDS="445,38,434,49,431,53,427,62,430,72,
435,77,445,92,456,77,463,72,463,62,462,53,455,47"
HREF="/workshop/graphics/nepglobe.gif">
<AREA SHAPE="circle" COORDS="479,66,3"
HREF="/workshop/graphics/pluglobe.gif">
</MAP>

明白了么？

wolfgang_l 2008-04-09