This commit is contained in:
ericli1018
2025-06-13 12:24:35 +08:00
parent 1caae33c43
commit 6dfe3e0677
74 changed files with 1497 additions and 253 deletions

View File

@ -27,21 +27,21 @@
.carousel-intro .carousel-caption h2 {
display: inline-block;
color: #fff;
font-size: 1rem;
font-size: 1.3rem;
/* text-shadow: 1px 1px 1px #fff;*/
font-weight: bold;
margin: 0 0 20px 0;
padding: 0;
line-height: 24px;
line-height: 28px;
}
.carousel-intro .carousel-caption p {
color: #fff;
font-size: 0.6rem;
font-size: 1rem;
/* text-shadow: 1px 1px 1px #333; */
font-weight: normal;
margin: 0 0 20px 0;
padding: 0;
line-height: 16px;
line-height: 18px;
}
.carousel-intro .carousel-caption a {
@ -98,6 +98,11 @@
background-color: #e27a14;
}
.caption-img {
text-align: center;
}
/*========================================================
@ -138,54 +143,60 @@
/*========================================================
尺寸設定
=========================================================*/
@media (max-width: 479px) {
.carousel-intro .carousel-item img {
height: 240px;
}
}
@media (min-width: 480px) and (max-width: 767px) {
.carousel-intro .carousel-item img {
height: 320px;
}
}
@media (max-width: 767px) {
.carousel-intro .carousel-item img {
object-fit: cover;
object-position: center center;
.carousel-intro .carousel-item > img {
height: 420px;
}
.carousel-intro .carousel-caption p {
display: none;
}
}
@media (min-width: 480px) and (max-width: 767px) {
.carousel-intro .carousel-item > img {
height: 600px;
}
}
@media (max-width: 767px) {
.carousel-intro .carousel-item > img {
object-fit: cover;
object-position: center center;
}
.caption-img img {
max-width: 50%;
max-height: 45%;
margin-top: 30px;
}
}
@media (min-width: 768px) {
.carousel-intro .carousel-caption {
text-align: left;
}
.carousel-intro .carousel-caption h2 {
font-size: 1.4rem;
line-height: 28px;
}
.carousel-intro .carousel-caption p {
font-size: 0.8rem;
font-size: 1rem;
line-height: 20px;
}
.carousel-intro .carousel-caption a {
padding: 10px 30px;
border-radius: 30px;
}
.caption-img img {
max-height: 60vh;
}
}
@media (min-width: 992px) {
.carousel-intro .carousel-caption {
top: 50%;
left: 20%;
transform: translate(-20%,-50%);
text-align: left;
width: 40%;
width: 70%;
}
.carousel-intro .carousel-caption h2 {
font-size: 1.4rem;
font-size: 1.6rem;
line-height: 30px;
}
.carousel-intro .carousel-caption p {
font-size: 0.8rem;
font-size: 0.9rem;
line-height: 24px;
}
.carousel-control-prev-icon,
@ -200,20 +211,20 @@
line-height: 36px;
}
.carousel-intro .carousel-caption p {
font-size: 0.9rem;
font-size: 1rem;
line-height: 24px;
}
}
@media (min-width: 1600px) {
.carousel-intro .carousel-caption {
width: 25%;
width: 70%;
}
.carousel-intro .carousel-caption h2 {
font-size: 2.2rem;
font-size: 2rem;
line-height: 40px;
}
.carousel-intro .carousel-caption p {
font-size: 1rem;
font-size: 1.1rem;
line-height: 28px;
}
.carousel-indicators {
@ -286,11 +297,6 @@
object-fit: cover;
}
}
@media (min-width: 768px) {
.carousel-intro .carousel-caption h2 {
font-size: 1.6rem;
}
}
@media (min-width: 992px) {
.page-banner-caption {
left: 16vw;