个人中心
gpt4 book ai didi

html - 无法查看淡入淡出图像？

转载 作者：太空宇宙 更新时间：2023-11-04 13:46:47 26 4
gpt4 key购买 nike

我似乎在我的 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">

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

最佳答案

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

关于html - 无法查看淡入淡出图像？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/22468749/

26 4 0
文章推荐： javascript - 获取 URL 的最后一个字符
文章推荐： c++ - 如何将选项卡小部件与按钮同步
文章推荐： javascript - 在移动设备上禁用网站正文的触摸平移
文章推荐： c++ - 使用 WideCharToMultibyte 时如何删除控制字符
太空宇宙
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com