gpt4 book ai didi

html - 将 标签放在 4 个图像上的横幅上以连接到 4 个不同的 url

转载 作者:行者123 更新时间:2023-11-28 08:28:17 24 4
gpt4 key购买 nike

我正在尝试在我拥有的横幅上的特定区域周围放置标签。这个横幅有 4 个不同的 Logo ,我需要每个 Logo 的链接。

横幅--->>>>

ImageOne ImageTwo ImageThree ImageFour

横幅--->>>>

ImageOne Url = www.cnnsi.com

ImageTwo Url = www.cnn.com 等等

我怎样才能做到水平放置它们的位置?

我可以毫无问题地完成第一个,但我是否需要为其余 3 个位置使用绝对值?

下面是一些 Css:如果我将位置设置为:#imageTwo 上的相对位置 - 那么它将位于页面顶部宽度为 999 x 高度为 151 的页眉横幅下方。它将把它放在标题之外,有点低于#imageOne。任何帮助将不胜感激!

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="../Content/Site.css"/>
<script src="../Scripts/jquery-1.8.2minO.js" type="text/javascript">
</script>
</head>
<body>
<div id="header" title="Test">
<a id="imageOne" href="http://cnnsi.com" target="_blank" title="cnnsi.com"></a>
<a id="imageTwo" href="http://cnn.com" target="_blank" title="cnn.com"></a>
</div>
</body>
</html>


#imageOne {
display: block;
position: relative;
top: 24px;
left: 16px;
height: 95px;
width: 162px;
}

#imageTwo {
display: block;
position: relative;
top: 24px;
left: 175px;
height: 95px;
width: 162px;
}

最佳答案

要么使用

float:left;
width:25%;

对于所有图像,或者你可以设置它们

display:inline;

如果您为所有图像分配一个类,将会更容易。另外,如果你只是删除 display:block 你应该没问题。通常你想避免在这种情况下使用 position:aboslute。

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com