1

我是网络建设的新手。目前正在关注制作图片库的教程。 http://www.webreference.com/programming/css_gallery/index.html

除了缩略图部分之外，这一切都正常（足以让我根据自己的喜好修复问题）。下面是我认为与我寻求的帮助相关的缩略图的 html 和 css 片段。基本上，当您将鼠标悬停在缩略图上时，主图像将出现在上面页面的空闲空间中。那种作品（图像没有出现在正确的位置，但我可以解决这个问题）但缩略图没有显示我的图像。

我将容器 div 更改为“gallery”，因为我的 html 中已经有一个容器，并且不希望它受到教程之后的新 css 的影响......

html:

 <li> 
      <a class="gallery slidea" href="#nogo"> 
        <span> 
          <img src="images/Picture 014.jpg" alt="Wedding" title="Wedding" /> 
          <br /> 
          Wedding
      <br /> 
        Outside area wedding
        </span> 
      </a> 
    </li>

CSS：

#gallery a.slidea {
background:url(images/Picture 014 thumb.jpg);
height:38px;
width:50px;
}

同样对于我的 CSS，W3C 验证器说“#gallery a.slidea”值错误：背景解析错误 thumb.jpg），我不明白。

希望得到一些帮助：D

干杯

PS 我正在考虑把这个网站放到 wordpress 上（这是一个教程，我稍后会跟进，希望能取得更大的成功）

4

2 回答 2

0

对类的调用与类的名称不匹配

 <a class="gallery slidea" href="#nogo">

正在打电话

 #gallery a.slidea {

尝试使它们具有相同的名称，例如

 <a class="gallery_slide" href="#nogo"> 

 #gallery_slide a {
于 2013-03-29T02:13:30.043 回答
0

你的错误在这里：

background:url(images/Picture 014 thumb.jpg);

那个空间把它扔掉了。将网址放在引号中：

background:url('images/Picture 014 thumb.jpg');

另一个问题出在您的 HTML 中。

你的 CSS 说#gallery a.slidea

这将指向在 ID 为“gallery”的元素中与“slidea”类的所有链接。您的 HTML 表明该链接属于“gallery”和“slidea”类。正确的方法将取决于您的目标。

于 2013-03-29T02:22:39.097 回答