Question

我担心我的编码知识非常基础，而且我在为客户工作的网站上遇到了麻烦。基本上我使用slideshow，我发现只有在我因某些原因不包含< doctype ! html >时才有效。

我还添加了captions，它在chrome和firefox上运行正常，但是在IE上它们根本不会显示，除非doctype存在。然而，幻灯片开始滚动！

我正在尝试找到一个解决方案，我可以获得箭头控制的幻灯片和适用于IE的字幕。我对jQuery的了解几乎没有。请帮忙！

Answer 1

你下载了这个文件吗？

你确定你把这段代码？

figure {
  display: block;
  position: relative;
  float: left;
  overflow: hidden;
  margin: 0 20px 20px 0;
}
figcaption {
  position: absolute;
  background: black;
  background: rgba(0,0,0,0.75);
  color: white;
  padding: 10px 20px;
  opacity: 0;
  -webkit-transition: all 0.6s ease;<!--this is what make it works in safari/chrome-->
  -moz-transition:    all 0.6s ease;<!--this is what make it works in mozila-->
  -o-transition:      all 0.6s ease;<!--this is what make it works in opera-->
}
figure:hover figcaption {
  opacity: 1;
}
figure:before {
  content: "?";
  position: absolute;
  font-weight: 800;
  background: black;
  background: rgba(255,255,255,0.75);
  text-shadow: 0 0 5px white;
  color: black;
  width: 24px;
  height: 24px;
  -webkit-border-radius: 12px;<!--this is what makes it works safari/chrome-->
  -moz-border-radius:    12px;<!--this is what make it works in mozila-->
  border-radius:         12px;
  text-align: center;
  font-size: 14px;
  line-height: 24px;
  -moz-transition: all 0.6s ease;
  opacity: 0.75;
}

Answer 2

我发现了问题您需要做的就是将CSS放在html页面中喜欢这个

<head>
<style type="text/css">
all the css
</style>
</head>

<body>
your code
</body>

正常，只需使用html页面中的css，即时通讯非常可行

幻灯片和标题在IE中不起作用

2 个答案: