Original link: https://www.lanka.cn/4682_4682.html
When I published an article today, I needed to embed a video from station B in the article. After using the iframe code, I found that the height could not be adapted. If the iframe height is defined, it is normal on the PC side, but the height on the mobile side is abnormal. After After consulting a lot of information, I finally solved this problem today.
The solution is as follows:
1. Add CSS styles as follows:
.meta-media { position: relative; margin-bottom: 30px; float: left; width: 100%; height: 0; padding-bottom: 75%;}.video { position: absolute; width: 100%; height: 100%; left: 0; top: 0;}
2. Add class to iframe as video, as follows:
<iframe src="https://player.bilibili.com/player.html?aid=985946126&bvid=BV1ft4y1c7CH&cid=847343270&page=1" frameborder="no" class="video" allowfullscreen="true"> </iframe>
In this way, two steps are solved, and a record is made for reference when needed.
This article is reprinted from: https://www.lanka.cn/4682_4682.html
This site is for inclusion only, and the copyright belongs to the original author.