mirror of https://gitee.com/topnuomi/zxf
优化二级banner
This commit is contained in:
parent
b7f99e74aa
commit
0c4245e159
|
@ -35,7 +35,8 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="section sec-banner" style="background-image: url('/images/banner2.png');">
|
<div class="section sec-banner">
|
||||||
|
<img class="media" src="images/banner2.png" alt="">
|
||||||
<div class="banner-text">
|
<div class="banner-text">
|
||||||
<p>您的现金流安全 <span class="cname">左心房</span>来守护</p>
|
<p>您的现金流安全 <span class="cname">左心房</span>来守护</p>
|
||||||
<p>YOUR CASH FLOW LEFT ATRIUM TO GUARD</p>
|
<p>YOUR CASH FLOW LEFT ATRIUM TO GUARD</p>
|
||||||
|
|
|
@ -35,7 +35,8 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="section sec-banner" style="background-image: url('/images/banner2.png');">
|
<div class="section sec-banner">
|
||||||
|
<img class="media" src="images/banner2.png" alt="">
|
||||||
<div class="banner-text">
|
<div class="banner-text">
|
||||||
<p>您的现金流安全 <span class="cname">左心房</span>来守护</p>
|
<p>您的现金流安全 <span class="cname">左心房</span>来守护</p>
|
||||||
<p>YOUR CASH FLOW LEFT ATRIUM TO GUARD</p>
|
<p>YOUR CASH FLOW LEFT ATRIUM TO GUARD</p>
|
||||||
|
|
|
@ -35,7 +35,8 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="section sec-banner" style="background-image: url('/images/banner2.png');">
|
<div class="section sec-banner">
|
||||||
|
<img class="media" src="images/banner2.png" alt="">
|
||||||
<div class="banner-text">
|
<div class="banner-text">
|
||||||
<p>您的现金流安全 <span class="cname">左心房</span>来守护</p>
|
<p>您的现金流安全 <span class="cname">左心房</span>来守护</p>
|
||||||
<p>YOUR CASH FLOW LEFT ATRIUM TO GUARD</p>
|
<p>YOUR CASH FLOW LEFT ATRIUM TO GUARD</p>
|
||||||
|
|
|
@ -312,16 +312,25 @@
|
||||||
color: #E72A3A;
|
color: #E72A3A;
|
||||||
}
|
}
|
||||||
.section.sec-banner {
|
.section.sec-banner {
|
||||||
|
position: relative;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 4.5rem;
|
height: 4.5rem;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
background-position: center center;
|
}
|
||||||
background-repeat: no-repeat;
|
.section.sec-banner .media {
|
||||||
background-size: cover;
|
z-index: 5;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
object-fit: cover;
|
||||||
}
|
}
|
||||||
.section.sec-banner .banner-text {
|
.section.sec-banner .banner-text {
|
||||||
|
position: relative;
|
||||||
|
z-index: 10;
|
||||||
padding-top: 0.6rem;
|
padding-top: 0.6rem;
|
||||||
}
|
}
|
||||||
.section.article-detail {
|
.section.article-detail {
|
||||||
|
|
|
@ -404,16 +404,26 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.section.sec-banner {
|
.section.sec-banner {
|
||||||
|
position: relative;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 4.5rem;
|
height: 4.5rem;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
background-position: center center;
|
|
||||||
background-repeat: no-repeat;
|
.media {
|
||||||
background-size: cover;
|
z-index: 5;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
object-fit: cover;
|
||||||
|
}
|
||||||
|
|
||||||
.banner-text {
|
.banner-text {
|
||||||
|
position: relative;
|
||||||
|
z-index: 10;
|
||||||
padding-top: 0.6rem;
|
padding-top: 0.6rem;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -35,7 +35,8 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="section sec-banner" style="background-image: url('/images/banner2.png');">
|
<div class="section sec-banner">
|
||||||
|
<img class="media" src="images/banner2.png" alt="">
|
||||||
<div class="banner-text">
|
<div class="banner-text">
|
||||||
<p>您的现金流安全 <span class="cname">左心房</span>来守护</p>
|
<p>您的现金流安全 <span class="cname">左心房</span>来守护</p>
|
||||||
<p>YOUR CASH FLOW LEFT ATRIUM TO GUARD</p>
|
<p>YOUR CASH FLOW LEFT ATRIUM TO GUARD</p>
|
||||||
|
|
|
@ -35,7 +35,8 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="section sec-banner" style="background-image: url('/images/banner2.png');">
|
<div class="section sec-banner">
|
||||||
|
<img class="media" src="images/banner2.png" alt="">
|
||||||
<div class="banner-text">
|
<div class="banner-text">
|
||||||
<p>您的现金流安全 <span class="cname">左心房</span>来守护</p>
|
<p>您的现金流安全 <span class="cname">左心房</span>来守护</p>
|
||||||
<p>YOUR CASH FLOW LEFT ATRIUM TO GUARD</p>
|
<p>YOUR CASH FLOW LEFT ATRIUM TO GUARD</p>
|
||||||
|
|
Loading…
Reference in New Issue