Question

我正在使用podsnack mp3播放器。但是，每次刷新页面都会刷新随机数字ID代码，例如id="cover#some-random-number#

所以它会像这样出现

covercontainer80191
covercontainer36190

等等。我想要做的是显示：无掩盖封面，只显示歌曲标题。有没有办法在CSS中执行此操作？

我正在使用的代码实际上是<iframe/>。

<iframe style="border:none;margin-bottom: 5px" src="http://files.podsnack.com/iframe/embed.html?hash=ah3fblli&t=1369709402" width="425" height="320" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true" ></iframe>

Answer 1

如果它在iframe中，我认为你只能用CSS做很多事情。它是一个单独的文档，不会从父文档继承样式。

然而，在你的情况下，你可以做一个小技巧来实现你的目标。使用overflow:hidden将iframe包装到另一个元素中，然后以隐藏不需要的内容的方式放置iframe：

<div>
    <iframe></iframe>
</div>

你必须在这里调整数字，但这似乎对你的情况有好处：

div {
    overflow:hidden;
    width:199px;
    height:260px;
    position:relative;
}

iframe {
    position:absolute;
    top:-43px;
    left:-200px
}

演示，仅显示播放列表：http://jsfiddle.net/sxyXF/

但是，“封面”也包含播放按钮，因此无法播放曲目。

Answer 2

如果我理解你的问题你想隐藏所有这些实例......如果是这种情况你可以在你的CSS中隐藏它们

div[class~="covercontainer"]{
display:none;
}

这有可能的CSS技巧吗？

2 个答案: