1

我一直在让自己发疯,试图用 CSS 找出这个看似简单的 div 位置。我有一个包含单个图像的网页,由 CSS 定义为背景图像。我想覆盖一个包含可点击链接的 div,如下所示:

https://dl.dropbox.com/u/39682698/Fraud-Fighter2.png

我正在使用 Dreamweaver CS6 和绝对定位的 DIV 来尝试实现这一点。但是当页面呈现时,链接没有居中。我对 CSS 相当陌生,因此非常感谢有关使用 CSS 放置对象的最佳方法的一些指导。我以前成功地使用过 AP DIV.. 不知道为什么它现在不起作用。这是页面:

http://us.aktive.me/maintenance/

HTML:

<!doctype 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="apDiv1"><a href="http://threatmetrix.com/support">http://threatmetrix.com/support</a></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}

#apDiv1 {
    position: absolute;
    width: 351px;
    height: 43px;
    z-index: 1;
    left: 233px;
    top: 240px;
}

非常感谢您的帮助。-院长

4

2 回答 2

0

从我的角度来看,定位太远了,没必要。怎么样

   #apDiv1 {
        margin-top: 240px;
        text-align: center;
    }

就是这样,对我有用,因为图像的大小是固定的

于 2013-03-19T03:20:56.553 回答
0

如果您需要以 div 为中心的文本,请尝试:

#apDiv1 {
    text-align: center;
    ...
}
于 2013-03-19T03:21:15.367 回答