[英]CSS div troubles (borders and images)
Situation's a bit of a long stoy so I won't bother. 情况有些漫长,所以我不会打扰。 Point being, I'm trying to place image links to different pages on specific places on top of a background image.
重点是,我试图将指向不同页面的图像链接放在背景图像上方的特定位置。 I have the background image, and I have the linked images appearing within the div.
我有背景图片,并且链接图片显示在div中。 The problem is now the images don't change no matter how I change their parameters.
现在的问题是,无论我如何更改图像参数,图像都不会改变。 Here's the HTML
这是HTML
<div class='links' id ='canvas'>
<a id='anchor1' href ='index.html'><img class='one' src ="images/links/Alert-detail.png" ></a>
<a id='anchor2' href ='index.html'><img class='two' src ="images/links/Command-detail.png" ></a>
<a id='anchor3' href ='index.html'><img class='three' src ="images/links/floppy-detail.png" ></a>
<a id='anchor4' href ='index.html'><img class='four' src ="images/links/smiling-computer-sea-green.png" ></a>
<a id='anchor5' href ='index.html'><img class='five' src ="images/links/trash-detail.png" ></a>
<a id='anchor6' href ='index.html'><img class='six' src ="images/links/unhappy-computer-blue.png" ></a>
<a id='anchor7' href ='index.html'><img class='seven' src ="images/links/watch-detail.png" ></a>
</div>
Note I'm not having the links lead to anywhere until I get the positions right. 请注意,直到我找到正确的位置,我才能获得指向任何地方的链接。
And the CSS for it 还有它的CSS
#canvas{
position:relative;
height: 410px;
width: 881px;
outline: 2px solid red;
background-image:url('../images/link layout.png');
}
.anchor1{
position:absolute;
top: 200px;
left: 100px;
outline: 2px solid green;
z-index: 15;
}
You are referring to .anchor1
which is a class, however you want to use #anchor1
which would refer to an ID. 您所指的是
.anchor1
,这是一个类,但是您想使用#anchor1
,这将引用一个ID。 I would suggest adding a class to all of the <a>
tags which you apply the position, outline
and z-index
to, and using the #anchor1
, #anchor2
etc for the left
and top
attributes. 我建议向所有
<a>
标记添加一个类,向其应用位置, outline
和z-index
,并为left
和top
属性使用#anchor1
, #anchor2
等。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.