.acf-repeater-specifications {
margin: 20px 0;
padding: 15px;
}
.specification-title {
margin: 0 0 15px 0;
color: #0168b7;
font-size: 18px;
font-weight: 600;
padding-top:40px;
}
.specification-content {
list-style: none;
padding: 0;
margin: 0;
}
.specification-content-item {
display: flex;
align-items: center;
margin-bottom: 1px;
padding: 1px 0;
border-bottom: 1px dashed #eee;
flex-wrap: wrap;
justify-content: flex-start; 
text-align: left; 
}
.spec-text {
flex: 0 0 25%; 
margin-right: 0; 
padding-right: 20px; 
box-sizing: border-box;
color: #555;
font-size: 16px;
}
.spec-text:last-child {
margin-right: 0;
}
.acf-repeater-empty {
color: #999;
font-style: italic;
margin: 15px 0;
}
/
.specification-content-item .spec-text:nth-child(4n) {
padding-right: 0;
}
.spec-col-1 { order: 1; }
.spec-col-2 { order: 2; }
.spec-col-3 { order: 3; }
.spec-col-4 { order: 4; }
.spec-text {
text-align: left;
flex: 0 0 25%;
box-sizing: border-box;
padding: 10 10 10 0;
min-height: 30px; 
display: inline-block; 
}
.spec-col-1{font-weight:500;}
<!----------------以下是参数组02的代码----------------------> .spec-two-container {
margin: 20px 0;
padding: 0;
} .spec-two-title {
font-size: 18px;
font-weight: 600;
color:#0168b7;
padding-top: 25px;
margin-left:15px;
} .spec-two-list {
list-style: none;
padding: 0;
margin: 0;
width: 100%;
} .spec-two-row {
display: flex;
align-items: flex-start; padding: 5px 0;
border-bottom: 1px dashed #eee;
font-size: 16px;
margin-left:15px;
} .spec-two-col1 {
flex: 0 0 50%;
text-align: left;
font-weight: 500;
padding-right: 15px;
box-sizing: border-box;
} .spec-two-col2 {
flex: 0 0 50%;
text-align: left;
padding-left: 15px;
box-sizing: border-box;
}
<!-------------------------以下是参数03组的代码-----------------------------------> .acf-repeater-specifications-three {
margin: 20px 0;
padding: 15px;
} .specification-item-three {
margin-bottom: 20px;
} .specification-title-three {
font-size: 18px;
font-weight: 600;
color: #0168b7;
padding-top: 15px;
margin-left:15px;
} .specification-content-three {
list-style: none;
padding: 0;
margin: 0;
} .specification-content-item-three {
display: flex;
align-items: center;
padding: 2px 0;
border-bottom: 1px dashed #ddd;
font-size: 16px;
margin-left:15px;
} .spec-col-1-three {
flex: 0 0 50%;
font-weight: 500;
padding-right: 10px;
box-sizing: border-box;
} .spec-col-2-three {
flex: 0 0 50%;
padding-left: 10px;
box-sizing: border-box;
}
<!-------------------------以下是主图的css代码---------------------------------> .product-gallery {
position: relative;
max-width: 1200px;
margin: 30px auto;
padding: 0 15px;
} .gallery-large {
width: 100%;
aspect-ratio: 1 / 1;
overflow: hidden;
margin-bottom: 30px;
border: 1px solid #e0e0e0;
box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}
.large-img {
width: 100%;
height: 100%;
object-fit: contain;
padding: 20px;
box-sizing: border-box;
transition: opacity 0.3s ease;
} .gallery-thumbs-container {
display: flex;
align-items: center;
position: relative;
width: 100%;
} .gallery-thumbs {
display: flex;
gap: 10px;
overflow-x: auto;
flex: 1;
padding: 10px 0;
scrollbar-width: none; -ms-overflow-style: none;
margin: 0 40px; }
.gallery-thumbs::-webkit-scrollbar {
display: none; } .thumb-img {
width: calc((100% - 40px) / 5); height: auto;
cursor: pointer;
position: relative;
transition: transform 0.2s;
}
.thumb-img:hover {
transform: scale(1.03);
} .thumb-img.active::after {
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(150, 150, 150, 0.5);
pointer-events: none;
} .gallery-prev {
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: 40px;
height: 80px; background-color: #555;
color: white;
border: none;
font-size: 24px;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
z-index: 10;
} .gallery-next {
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
width: 40px;
height: 80px; background-color: #555;
color: white;
border: none;
font-size: 24px;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
z-index: 10;
} .gallery-prev:hover,
.gallery-next:hover {
background-color: #333;
} @media (max-width: 768px) {
.gallery-thumbs .thumb-img {
width: calc((100% - 20px) / 3); }
.gallery-prev,
.gallery-next {
width: 30px;
height: 60px;
font-size: 20px;
}
}
.thumb-img { border: 2px solid transparent; transition: border-color 0.3s ease; }
.thumb-img.active {
border-color: blue !important;
}
<!------------以下是下载页面css---------------------> .download-container {
max-width: 1400px;
margin: 0 auto;
padding: 40px 20px;
} .download-section-title {
font-size: 30px;
font-weight: 600;
margin: 30px 0 20px;
padding-left: 12px;
border-left: 4px solid #007bff; color: #333;
} .download-list {
display: flex;
flex-direction: column;
gap: 1px; background: #f5f5f5;
border-radius: 4px;
overflow: hidden;
} .download-item {
display: flex;
justify-content: space-between; align-items: center;
width: 100%;
min-height: 26px;
padding: 2px 20px;
background: #ffffff;
transition: background 0.2s;
box-sizing: border-box;
} .download-list .download-item:nth-child(odd) {
background-color: #e4ecf7; }
.download-list .download-item {
background-color: #f4f6f8; }
.download-item:hover {
background: #fafafa;
} .download-title {
flex: 0 0 70%;
font-size: 16px;
color: #333;
padding: 8px 0;
box-sizing: border-box;
text-align: left; } .download-date {
flex: 0 0 15%;
font-size: 14px;
color: #666;
white-space: nowrap;
padding: 8px 0 8px 24px;
margin: 0;
position: relative;
box-sizing: border-box;
text-align: left; } .download-date::before {
content: "📅"; position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%); width: 16px;
} .download-button {
flex: 0 0 10%;
display: flex;
align-items: center;
gap: 6px;
color: #012641;
font-size: 14px;
text-decoration: none;
padding: 8px 0;
border-radius: 4px;
transition: all 0.2s;
box-sizing: border-box;
justify-content: center; padding-left:0;
}
.download-button .download-icon {
margin-top: -12px;   }
.download-info {
display: contents; }
.download-button:hover {
background: #0168b7;
color: #FFFFFF;
} .download-button:hover .download-icon {
color: #ffffff; } .download-icon {
display: inline-block;
width: 16px;
height: 16px;
color: #007bff;
content: "↓"; } @media (max-width: 768px) {
.download-item {
flex-direction: column; gap: 5px;
padding: 15px 20px;
}
.download-title,
.download-date,
.download-button {
flex: none;
width: 100%; }
}