如何从嵌入的社交媒体帖子中删除边框?



虽然我很欣赏这个问题时不时地出现,但到目前为止,我已经研究了我能回答的每一个答案,没有任何运气。所以,我决定打开一个新的线程...

我正在尝试将LinkedIn帖子嵌入到网页上,无论我尝试如何设置边框宽度等,嵌入的帖子周围总是有一个浅灰色的框架。嵌入Facebook帖子和推文时会出现相同的边框。我的印象是,这些平台上的原始帖子都有浅灰色边框,因此嵌入式版本也会有。我想知道是否有任何解决方法不涉及重写整个社交媒体体验。

谢谢你的帮助。请参阅下面的示例代码。


<!-- YouTube iframe version below -->
<iframe width="560" height="315" src="https://www.youtube.com/embed/mhrkdHshb3E" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

<!-- Twitter js version below -->
<blockquote class="twitter-tweet"><p lang="en" dir="ltr">More than 100 spacecraft have been signed up to fly on Falcon 9 since we launched the rideshare program. Small satellite operators can book their ride to orbit online → <a href="https://www.spacex.com/rideshare/index.html">https://www.spacex.com/rideshare/index.html</a> <a href="https://twitter.com/spaceflightinc/status/1273347941105795072">https://twitter.com/spaceflightinc/status/1273347941105795072</a></p>&mdash; SpaceX (@SpaceX) <a href="https://twitter.com/SpaceX/status/1273426202188005377?ref_src=twsrc%5Etfw">June 18, 2020</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

<!-- facebook iframe version below -->
<iframe src="https://www.facebook.com/plugins/post.php?href=https%3A%2F%2Fwww.facebook.com%2FNASA%2Fphotos%2Fa.67899501771%2F10158346617536772%2F&show_text=true&width=552&height=458&appId" width="552" height="458" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true" allow="encrypted-media"></iframe>
<!-- facebook js version below -->
<div id="fb-root"></div>
<script async defer crossorigin="anonymous" src="https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v7.0" nonce="6zFKXsAI"></script>
<div class="fb-post" data-href="https://www.facebook.com/NASA/photos/a.67899501771/10158346617536772/" data-show-text="true" data-width=""><blockquote cite="https://developers.facebook.com/NASA/photos/a.67899501771/10158346617536772/?type=3" class="fb-xfbml-parse-ignore"><p>Astronomers are used to studying celestial objects that are millions or even billions of years old. That’s why a...</p>Posted by <a href="https://www.facebook.com/NASA/">NASA - National Aeronautics and Space Administration</a> on&nbsp;<a href="https://developers.facebook.com/NASA/photos/a.67899501771/10158346617536772/?type=3">Wednesday, June 17, 2020</a></blockquote></div> 

<!-- LinkedIn iframe version below -->
<iframe src="https://www.linkedin.com/embed/feed/update/urn:li:share:6674757258863222784" height="209" width="504" frameborder="0" allowfullscreen="" title="Embedded post"></iframe>

div {position: relative; border: 2px solid #fff; width: 500px; height: 300px}
iframe {position: absolute; width: 100%; height: 100%; top: 0}
p {margin: 0; position: absolute; width: 100%; height: 100%; top: 0; border: 2px solid #FFF; z-index: 2; box-sizing: border-box}
<html>
<head>
<title>Page Title</title>
</head>
<body>
<div>
<iframe src="https://www.linkedin.com/embed/feed/update/urn:li:share:6674757258863222784" frameborder="0" allowfullscreen="" title="Embedded post">
</iframe>
<p></p>
</div>
</body>
</html>

最新更新