如何在HTML中嵌入仅含播放按钮的Apple Music预览（隐藏曲目信息）

Apple Music官方提供的歌曲预览嵌入代码会显示曲目艺术家、标题及封面，示例代码如下：

<iframe allow="autoplay *; encrypted-media *;" frameborder="0" height="150" style="width:100%;max-width:660px;overflow:hidden;background:transparent;" sandbox="allow-forms allow-popups allow-same-origin allow-scripts allow-storage-access-by-user-activation allow-top-navigation-by-user-activation" src="https://embed.music.apple.com/us/album/pancho-and-lefty/1182567204?i=1182567495"></iframe>

若要实现仅显示播放按钮的效果，可通过视觉裁剪的方式实现，具体有两种方案：

方案一：直接修改iframe高度 #

将iframe的高度调整为刚好容纳播放按钮的尺寸（约32px），其余内容会被自动隐藏：

<iframe allow="autoplay *; encrypted-media *;" frameborder="0" height="32" style="width:100%;max-width:660px;overflow:hidden;background:transparent;" sandbox="allow-forms allow-popups allow-same-origin allow-scripts allow-storage-access-by-user-activation allow-top-navigation-by-user-activation" src="https://embed.music.apple.com/us/album/pancho-and-lefty/1182567204?i=1182567495"></iframe>

方案二：容器包裹+负边距定位 #

用固定高度的容器包裹iframe，通过负边距将播放按钮区域移到可视范围内，这种方式更灵活，可适配不同布局需求：

<div style="height:32px;overflow:hidden;max-width:660px;width:100%;">
  <iframe allow="autoplay *; encrypted-media *;" frameborder="0" height="150" style="width:100%;margin-top:-118px;background:transparent;" sandbox="allow-forms allow-popups allow-same-origin allow-scripts allow-storage-access-by-user-activation allow-top-navigation-by-user-activation" src="https://embed.music.apple.com/us/album/pancho-and-lefty/1182567204?i=1182567495"></iframe>
</div>

注：margin-top的数值为「原iframe高度 - 容器高度」，这里150-32=118px，可根据实际显示效果微调数值。

由于Apple Music官方未提供仅显示播放按钮的嵌入参数，以上两种方案均通过CSS视觉裁剪实现，效果与目标示例一致。

内容的提问来源于stack exchange，提问作者Jeff Parker