0

我似乎在我的 HTML/CSS 中遇到了一个小障碍。我尝试在我的索引中使用这种交叉淡入淡出技术并且效果很好但是当我尝试在我的第二个布局中使用它时，当我打开它时图像不会出现？:(

这是布局 2 的 HTML：

<!DOCTYPE html>

<html>
<head>

    <title>Welcome!</title>

    <meta charset="UTF-8">
    <link rel="stylesheet" href="../css/style.css" type="text/css">
</head>

<body>
<img class="image5" src="../images/header.png" alt="header">
<a href="../index.html"><div id="cf" >
    <img class="bottom2" src="images/logo4.png" alt="logo4"/>
    <img class="top2" src="images/logo3.png" alt="logo3"/>
</div>

</body>
</html>

这是它的CSS：

.image5 {
    position: absolute;
    top: 0px;
    left: 0px; 
    width: 1500px;
    height: 700px;
        }

 #cf {
  position:relative;
  top: 20px;
  left:20px;
  height:277px;
  width:277px;
}

 #cf img {
  position:absolute;
  left:0;
  opacity: 1;
  -webkit-transition: opacity 1s ease-in-out;
  -moz-transition: opacity 1s ease-in-out;
  -o-transition: opacity 1s ease-in-out;
  transition: opacity 1s ease-in-out;
}

 #cf img.top2:hover {
  opacity:0;
}

我尝试将其通过验证器并显示两个错误：

 - Error 1:

Line 20, Column 7: End tag for body seen, but there were unclosed elements.
</body>

 - Error 2:

Line 15, Column 24: Unclosed element a.
<a href="../index.html"><div id="cf">

我不确定那是什么意思。对不起，我还是个初学者。^^;;

4

1 回答 1

1

您的 css 正在寻找标签#cfid，然后img在其中寻找。也许是不正确的嵌套把它搞砸了。对于您的验证错误，您没有关闭链接标签。<a href ...>需要用 关闭</a>。尝试关闭它，看看它是否有帮助。

于 2014-03-18T01:37:54.883 回答