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

我试图添加自定义边界周围播放器（soundcloud和youtube）和我的网站的内容。我没有太多编码myspace之外的经验，并在wordpress上试验代码。我在这里和整个网络上找到了代码，这些代码帮助我获得了我想要的在线HTML编辑器的结果。当我将代码添加到我的页面或在wordpress中发布时，结果最终只是玩家...没有图像。我附上了例子的图片和我获得最佳效果的代码。任何帮助将不胜感激。嵌入式播放器和图像中的内容为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>

来源

2017-09-06 Bryan Howard

请检查这一点，我已经添加了背景图像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>

来源

2017-09-06 10:54:55

哇。起初我无法完成它的工作，但意识到第一部分是CSS。我还在学习。无论如何非常感谢你。它改变了尺寸和填充后工作。如果我更改填充，尺寸和链接到源，这是否适用于任何类型的帖子？ –

明白了。只需要现在打破代码。 –

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

回答

相关问题