我一直在疯狂地尝试将一个 div 应用到另一个包含图像的 div 上。 div 应该包含一个简单的 HTML 链接,就像这张图片中那样:
https://dl.dropbox.com/u/39682698/Fraud-Fighter2.png
不幸的是,当页面呈现图像时,URL 并未以图像为中心,正如在此处的实时网站上所见:
http://us.aktive.me/maintenance/
HTML:
<html>
<head>
<meta charset="utf-8">
<title>ThreatMetrix Maintenance Page</title>
<link href="main.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="container">
<div id="apDiv1"><a href="http://threatmetrix.com/support">http://threatmetrix.com/support</a></div>
<div id="image"><img src="fraud-fighter.png" width="977" height="750" alt="ThreatMetrix Maintenance Page" /></div>
</div>
</body>
</html>
CSS:
@charset "utf-8";
/* CSS Document */
body {
background-color: #3fa9f5;
/*background-image:url(fraud-fighter.png);*/
background-repeat:no-repeat;
background-position:center;
background-position:top;
font-size : 1.5em;
font-family : Frutiger, "Frutiger Linotype", Univers, Calibri, "Gill Sans", "Gill Sans MT", "Myriad Pro", Myriad, "DejaVu Sans Condensed", "Liberation Sans", "Nimbus Sans L", Tahoma, Geneva, "Helvetica Neue", Helvetica, Arial, sans-serif;
}
a:link { background-color: transparent; color:#f28a1a}
a:visited { background-color: transparent; color:#f28a1a}
a:active { background-color: transparent; position:relative}
a:hover { background-color: transparent; color:#cb7518}
a.noformat { text-decoration: none; color: #121212}
#container {
width: 1000px;
height: 800px;
position: relative;
display: block;
margin-left: auto;
margin-right: auto;
}
#apDiv1 {
margin-top: 240px;
text-align: center;
position:absolute;
}
#image {
z-index: 10;
}
提前一百万感谢任何可以帮助我的人:) -院长
最佳答案
如下设置css。
#apDiv1 {
position: absolute;
right: 350px;
text-align: center;
top: 250px;
}
如果你想在 %
#apDiv1 {
position: absolute;
left: 30%;
text-align: center;
top: 31%;
}
关于css - 在另一个 div 上放置和对齐一个 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15491271/