first commit
This commit is contained in:
闫旭隆
187
AIEC-server/css/image-size-fix.css
Normal file
187
AIEC-server/css/image-size-fix.css
Normal file
@ -0,0 +1,187 @@
|
||||
/* ===== 强制底部新闻图片尺寸 380*200px - 最高优先级 ===== */
|
||||
|
||||
/* 使用最强优先级选择器组合 */
|
||||
body * img[class*="news-image"],
|
||||
body * img.news-image,
|
||||
html body img.news-image,
|
||||
#tickerCarousel img,
|
||||
.ticker-flip-card img,
|
||||
.flip-card-front img,
|
||||
.flip-card-back img,
|
||||
div[data-index] img,
|
||||
img[src*="新闻"],
|
||||
img[alt*="新闻"] {
|
||||
width: 380px !important;
|
||||
height: 200px !important;
|
||||
min-width: 380px !important;
|
||||
min-height: 200px !important;
|
||||
max-width: 380px !important;
|
||||
max-height: 200px !important;
|
||||
object-fit: cover !important;
|
||||
display: block !important;
|
||||
flex-shrink: 0 !important;
|
||||
position: relative !important;
|
||||
}
|
||||
|
||||
/* 翻转卡片容器 - 强制尺寸 */
|
||||
body .ticker-flip-card,
|
||||
html body .ticker-flip-card,
|
||||
#tickerCarousel .ticker-flip-card,
|
||||
div.ticker-flip-card[data-index],
|
||||
div[class*="ticker-flip-card"] {
|
||||
width: 380px !important;
|
||||
height: 200px !important;
|
||||
min-width: 380px !important;
|
||||
min-height: 200px !important;
|
||||
max-width: 380px !important;
|
||||
max-height: 200px !important;
|
||||
flex-shrink: 0 !important;
|
||||
display: block !important;
|
||||
position: relative !important;
|
||||
}
|
||||
|
||||
/* 内部容器 */
|
||||
body .flip-card-inner,
|
||||
html body .flip-card-inner,
|
||||
.ticker-flip-card > .flip-card-inner,
|
||||
div[class*="flip-card-inner"] {
|
||||
width: 380px !important;
|
||||
height: 200px !important;
|
||||
min-width: 380px !important;
|
||||
min-height: 200px !important;
|
||||
max-width: 380px !important;
|
||||
max-height: 200px !important;
|
||||
display: block !important;
|
||||
position: relative !important;
|
||||
}
|
||||
|
||||
/* 卡片正反面 */
|
||||
body .flip-card-front,
|
||||
body .flip-card-back,
|
||||
html body .flip-card-front,
|
||||
html body .flip-card-back,
|
||||
div[class*="flip-card-front"],
|
||||
div[class*="flip-card-back"] {
|
||||
width: 380px !important;
|
||||
height: 200px !important;
|
||||
min-width: 380px !important;
|
||||
min-height: 200px !important;
|
||||
max-width: 380px !important;
|
||||
max-height: 200px !important;
|
||||
display: flex !important;
|
||||
align-items: center !important;
|
||||
justify-content: center !important;
|
||||
position: absolute !important;
|
||||
}
|
||||
|
||||
/* 底部区域高度调整 */
|
||||
body .ticker-section,
|
||||
html body .ticker-section,
|
||||
div.ticker-section[style],
|
||||
section .ticker-section {
|
||||
height: 230px !important;
|
||||
min-height: 230px !important;
|
||||
max-height: 230px !important;
|
||||
position: absolute !important;
|
||||
bottom: 50px !important;
|
||||
left: 0 !important;
|
||||
right: 0 !important;
|
||||
overflow: visible !important;
|
||||
}
|
||||
|
||||
/* 3D容器 */
|
||||
body .ticker-3d-container,
|
||||
#ticker3D {
|
||||
height: 210px !important;
|
||||
min-height: 210px !important;
|
||||
overflow: visible !important;
|
||||
}
|
||||
|
||||
/* 轮播容器 */
|
||||
body .ticker-carousel,
|
||||
#tickerCarousel {
|
||||
height: 200px !important;
|
||||
min-height: 200px !important;
|
||||
display: flex !important;
|
||||
align-items: center !important;
|
||||
justify-content: center !important;
|
||||
gap: 80px !important; /* 增大间距让3张图片更好地居中对齐 */
|
||||
}
|
||||
|
||||
/* 覆盖所有媒体查询 - 禁用响应式调整 */
|
||||
@media all {
|
||||
body img.news-image,
|
||||
#tickerCarousel img,
|
||||
.ticker-flip-card img,
|
||||
body .ticker-flip-card,
|
||||
body .flip-card-inner,
|
||||
body .flip-card-front,
|
||||
body .flip-card-back {
|
||||
width: 380px !important;
|
||||
height: 200px !important;
|
||||
min-width: 380px !important;
|
||||
min-height: 200px !important;
|
||||
max-width: 380px !important;
|
||||
max-height: 200px !important;
|
||||
}
|
||||
|
||||
body .ticker-section {
|
||||
height: 230px !important;
|
||||
min-height: 230px !important;
|
||||
}
|
||||
|
||||
body .ticker-3d-container {
|
||||
height: 210px !important;
|
||||
min-height: 210px !important;
|
||||
transform: none !important; /* 禁用缩放变换 */
|
||||
}
|
||||
|
||||
body .ticker-carousel {
|
||||
height: 200px !important;
|
||||
min-height: 200px !important;
|
||||
gap: 80px !important; /* 保持3张图片间距 */
|
||||
}
|
||||
}
|
||||
|
||||
/* 覆盖高DPI和缩放设置 */
|
||||
@media (min-resolution: 120dpi),
|
||||
(min-resolution: 144dpi),
|
||||
(min-resolution: 192dpi) {
|
||||
body .ticker-3d-container {
|
||||
transform: none !important; /* 取消缩放 */
|
||||
display: block !important; /* 确保显示 */
|
||||
}
|
||||
|
||||
body .ticker-flip-card,
|
||||
body .ticker-flip-card img {
|
||||
width: 380px !important;
|
||||
height: 200px !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* 覆盖低高度视口设置 */
|
||||
@media (max-height: 700px),
|
||||
(max-height: 600px) {
|
||||
body .ticker-section {
|
||||
height: 230px !important;
|
||||
}
|
||||
|
||||
body .ticker-flip-card,
|
||||
body .ticker-flip-card img {
|
||||
width: 380px !important;
|
||||
height: 200px !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* 覆盖移动端设置 */
|
||||
@media (max-width: 768px) {
|
||||
body .ticker-section {
|
||||
height: 230px !important;
|
||||
}
|
||||
|
||||
body .ticker-flip-card,
|
||||
body .ticker-flip-card img {
|
||||
width: 380px !important;
|
||||
height: 200px !important;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user