修改banner的圖寬度度為100%

This commit is contained in:
Wayne Hsu 2023-05-25 15:19:58 +08:00
parent 75a19e7638
commit 4980f02024
3 changed files with 14 additions and 15 deletions

View File

@ -358,7 +358,7 @@
} }
.bannerArea .wrap .bannerBox img { .bannerArea .wrap .bannerBox img {
height: 100vh; height: auto;
-o-object-fit: cover; -o-object-fit: cover;
object-fit: cover; object-fit: cover;
} }
@ -424,8 +424,7 @@
.bannerArea .wrap .bannerContent .titleBox { .bannerArea .wrap .bannerContent .titleBox {
position: relative; position: relative;
height: 100px; margin-bottom: 1rem;
margin-bottom: 50px;
color: #FFF; color: #FFF;
} }
@ -455,10 +454,10 @@
} }
.bannerArea .wrap .bannerContent .titleBox .bottomTitle { .bannerArea .wrap .bannerContent .titleBox .bottomTitle {
font-size: 48px; font-size: 2rem;
font-weight: 400; font-weight: 400;
letter-spacing: 5.28px; letter-spacing: 5.28px;
line-height: 70px; /* line-height: 70px; */
} }
.bannerArea .wrap .bannerContent .titleBox .bottomTitle span { .bannerArea .wrap .bannerContent .titleBox .bottomTitle span {
@ -1749,7 +1748,7 @@
} }
.bannerArea .wrap .bannerContent .titleBox .bottomTitle { .bannerArea .wrap .bannerContent .titleBox .bottomTitle {
word-break: keep-all; word-break: keep-all;
font-size: 24px; font-size: 1rem;
} }
.bannerArea .wrap .bannerContent .titleBox .bottomTitle span { .bannerArea .wrap .bannerContent .titleBox .bottomTitle span {
font-size: 36px; font-size: 36px;

View File

@ -8,8 +8,8 @@
position:relative; position:relative;
z-index:99;} z-index:99;}
.bannerArea ul li{ /* .bannerArea ul li{
min-height:80vh;} min-height:80vh;} */
.playerBox{ .playerBox{
width:100%; width:100%;
@ -88,8 +88,8 @@ background: #000;
z-index:5;} z-index:5;}
@media (max-width:480px){ @media (max-width:480px){
.bannerArea ul li{ /* .bannerArea ul li{
min-height:320px;} min-height:320px;} */
.bannerArea ul li .Txt .btn{ .bannerArea ul li .Txt .btn{
margin-top:20px;} margin-top:20px;}

View File

@ -8,9 +8,9 @@
<meta name="description" content="{$site.mdesc}"> <meta name="description" content="{$site.mdesc}">
<meta name="keywords" content="{$site.mkeyword}"> <meta name="keywords" content="{$site.mkeyword}">
<link rel="stylesheet" type="text/css" href="{$tpl}css/layout.css"> <link rel="stylesheet" type="text/css" href="{$tpl}css/layout.css">
<link rel="stylesheet" type="text/css" href="{$tpl}css/home.css"> <link rel="stylesheet" type="text/css" href="{$tpl}css/home.css?v=1">
<link rel="stylesheet" type="text/css" href="{$tpl}css/fac.css"> <link rel="stylesheet" type="text/css" href="{$tpl}css/fac.css">
<link rel="stylesheet" type="text/css" href="{$tpl}css/video.css"> <link rel="stylesheet" type="text/css" href="{$tpl}css/video.css?v=1">
<link rel="stylesheet" type="text/css" href="{$tpl}css/jquery.mb.YTPlayer.min.css"> <link rel="stylesheet" type="text/css" href="{$tpl}css/jquery.mb.YTPlayer.min.css">
<script src="{$tpl}js/include.js"></script> <script src="{$tpl}js/include.js"></script>
<script src="{$tpl}js/jquery.mb.YTPlayer.js"></script> <script src="{$tpl}js/jquery.mb.YTPlayer.js"></script>
@ -37,7 +37,7 @@
<div class="topTitle">{$site.ename}</div> <div class="topTitle">{$site.ename}</div>
<div class="bottomTitle">{$site.cname}</div> <div class="bottomTitle">{$site.cname}</div>
</div> </div>
<span style="font-size:15px;"><span style="color:#ffffff;"> <span style="font-size:1rem;"><span style="color:#ffffff;">
{$site.slogon} {$site.slogon}
</span></span> </span></span>
<br /> <br />
@ -48,8 +48,8 @@
</div> </div>
</div> </div>
</div> </div>
<div class="playerBox" style="background:url('{$site.index_banner}'); background-size:cover;"> <div class="playerBox pc" style="background:url('{$site.index_banner}'); background-size:cover;">
<div id="bgndVideo" class="player" data-property="{videoURL:'{$site.index_ytb}',containment:'.playerBox',autoPlay:true, mute:true, startAt:0, opacity:1}">My video</div> <div id="bgndVideo" class="player pc" data-property="{videoURL:'{$site.index_ytb}',containment:'.playerBox',autoPlay:true, mute:true, startAt:0, opacity:1}">My video</div>
</div> </div>
</li> </li>
</ul> </ul>