Files
hexo_blog/themes/matery/layout/movies.ejs
T
2022-04-25 13:40:12 +08:00

72 lines
1.6 KiB
Plaintext

<%- partial('_partial/bg-cover') %>
<!-- 视频页面 -->
<style>
@media only screen and (max-width: 601px) {
.movies-w {
width: 90%;
margin: 0 auto;
}
.movies-h {
height: 90%;
padding-top: 5%;
padding-bottom: 5%;
}
}
/*中等屏幕下(平板类)的样式*/
@media only screen and (min-width: 600px) and (max-width: 992px) {
.movies-w {
width: 95%;
margin: 0 auto;
}
.movies-h {
height: 95%;
padding-top: 5%;
padding-bottom: 5%;
}
}
@media only screen and (min-width: 993px) {
.movies-w {
width: 80%;
margin: 0 auto;
}
.movies-h {
height: 80%;
padding-top: 5%;
padding-bottom: 5%;
}
}
</style>
<main class="content">
<div id="category-cloud" class="container chip-container">
<div class="card">
<div class="card-content">
<div>
<h1 style="text-align:center;">
📺
<span style="color:red;">励</span>
<span style="color:yellow;">志</span>
<span style="color:blue;">短</span>
<span style="color:green;">片</span>
</h1>
<div>
<div class="movies-w" style="position: relative; padding-bottom: 75%;">
<iframe class="movies-h" style="
position: absolute;
width: 100%;
left: 0;
top: 0;"
src="//player.bilibili.com/player.html?aid=2979186&cid=4667585&page=1" scrolling="no" border="0"
frameborder="no"
framespacing="0"
allowfullscreen="true">
</iframe>
</div>
</div>
</div>
</div>
</div>
</main>