【问题标题】:How do I center align an embedded soundcloud widget?如何居中对齐嵌入式 soundcloud 小部件?
【发布时间】:2015-08-19 06:36:32
【问题描述】:

我使用了来自 soundcloud 的小部件 API 并将小部件嵌入到我的 HTML 文件中,但我无法将其居中对齐。

HTML代码是

<iframe width="50%" height="300" scrolling="no" frameborder="no" align="middle" src="musiclink&amp;auto_play=false&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false&amp;visual=true"></iframe>

如您所见,我尝试了 align="middle" 但它不起作用。 我尝试了 align="left" 并且有效,但由于某种原因 align="middle" 不起作用。此外,我进入 API 代码并尝试将 CSS 样式更改为

.widget {
    background-position: center center;
}

但这也没用

我做错了什么/错过了什么?

【问题讨论】:

    标签: html css widget soundcloud


    【解决方案1】:

    你可以用 div 包围 iframe:

    <div style='text-align:center'>
    <iframe width="50%" height="300" scrolling="no" frameborder="no" align="center" src="musiclink&amp;auto_play=false&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false&amp;visual=true"></iframe>
    </div>
    

    【讨论】:

      【解决方案2】:

      middlevalign 的值。 请改用align="center"

      更多关于valignHere.

      更多关于alignHere

      【讨论】:

        【解决方案3】:

        在 iframe 周围放置一个 div 并将左右边距设置为自动。它将把这个 div 放在它的容器中。

        <div style='margin:0 auto;'>
        <iframe width="50%" height="300" scrolling="no" frameborder="no" align="center" src="musiclink&amp;auto_play=false&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false&amp;visual=true"></iframe>
        </div>
        

        【讨论】:

          猜你喜欢
          • 1970-01-01
          • 1970-01-01
          • 2015-12-08
          • 2023-02-06
          • 1970-01-01
          • 2020-09-06
          • 1970-01-01
          • 2023-03-10
          • 1970-01-01
          相关资源
          最近更新 更多