Question

我正在尝试为玩家（soundcloud和youtube）添加自定义边框，并为我的网站添加内容。我没有太多经验在myspace之外编码和在wordpress上试验代码。我在这里和网上找到了代码，帮助我获得了我想要的在线HTML编辑器的结果。当我将代码添加到我的页面或在wordpress中发布时，结果最终只是播放器......没有图像。我附上了示例图片和我最好的代码。任何帮助将不胜感激。

This is how I want the border to fit around the players and content

我正在尝试粘贴给出最接近结果的代码，但显然它没有正确粘贴，因为它没有正确格式化（可能回答了我的部分问题）。我确实粘贴了第二个最接近的代码。我实际上也在Wordpress中工作了。但是，我不知道如何正确地将播放器放在图像上。图像和播放显示，但没有对齐。再次感谢任何帮助。

<div style="background: url(http://www.dontcursekids.com/wp-content/uploads/2017/09/Border-1.png) no-repeat; padding: 18px; width: 600px; height: 300px;">
 <iframe width="80%" height="154" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/280952276&amp;color=ff5500&amp;auto_play=false&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false"></iframe>

Answer 1

请检查一下，我已将背景图片添加到iframe

.frame_outer iframe{
  padding: 56px 49px;
    background: url(http://www.dontcursekids.com/wp-content/uploads/2017/09/Border-1.png);
    background-size: 100% 100%;
}

<div class="frame_outer" style="padding: 18px; width: 600px; height: 300px;">
<iframe width="80%" height="154" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/280952276&amp;color=ff5500&amp;auto_play=false&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false"></iframe></div>

嵌入式播放器和图像内容为wordpress

1 个答案: