https://www.formaveil.com/custom_140171.html
极境作品案例
极境作品案例
/* 1. 强制隐藏智邦系统预设刊头与多余空隙 */
#banner, .banner, .header-banner, .banner-box, #top-banner, .header_bg, .header_img, #logo_area, .bannerWrp {
display: none !important;
height: 0 !important;
padding: 0 !important;
overflow: hidden !important;
border: none !important;
visibility: hidden !important;
}
table { margin-top: 0 !important; border-collapse: collapse !important; }
/* --- 列表容器 --- */
.project-list-grid {
display: flex;
flex-wrap: wrap;
/* 维持较宽的版面 (1300px)，让照片有空间展示 */
max-width: 1300px;
margin: 0 auto;
padding: 0 20px;
gap: 30px; /* 电脑版间距 */
justify-content: center;
}
/* 2. 作品卡片特效 */
.project-card {
transition: all 0.3s ease;
cursor: pointer;
text-decoration: none !important;
display: block;
background: #fff;
box-shadow: 0 5px 15px rgba(0,0,0,0.05);
/* 电脑版：维持 30% (一排 3 张) */
width: 30%;
min-width: 300px;
text-align: left;
border-radius: 4px;
overflow: hidden;
position: relative;
z-index: 10;
}
.project-card:hover {
transform: translateY(-5px);
box-shadow: 0 15px 30px rgba(0,0,0,0.1);
}
/* ★ 电脑版设定：强制 4:3 比例 (横式风景) ★ */
.project-img-box {
width: 100%;
height: auto;
aspect-ratio: 4 / 3; /* 这里控制电脑版的比例 */
overflow: hidden;
margin-bottom: 0 !important;
padding-bottom: 0 !important;
display: block;
pointer-events: none;
}
.project-img {
transition: transform 0.6s ease;
width: 100%;
height: 100%;
object-fit: cover; /* 确保填满框框并裁切 */
display: block;
vertical-align: bottom;
}
.project-card:hover .project-img {
transform: scale(1.08);
}
/* 文字区域设定 */
.project-text-area {
padding: 20px 25px;
background-color: #fff;
position: relative;
z-index: 2;
margin-top: 0;
pointer-events: none;
}
.project-text-area span {
display: block;
margin-top: 0;
margin-bottom: 5px;
font-size: 12px;
color: #c5a059;
letter-spacing: 1px;
font-weight: 600;
}
.project-text-area h3 {
color: #222;
font-size: 20px;
margin: 5px 0 8px 0;
letter-spacing: 1.5px;
font-weight: 500;
line-height: 1.4;
}
.project-text-area p {
color: #888;
font-size: 14px;
margin: 0;
}
/* --- 手机版 RWD 调整 --- */
@media (max-width: 768px) {
.project-list-grid {
padding: 0 20px;
gap: 0;
}
/* 手机版：维持单行显示 */
.project-card {
width: 100%;
min-width: 0;
margin-bottom: 40px;
box-shadow: 0 5px 20px rgba(0,0,0,0.08);
}
/* ★ 手机版关键修正：设定长宽比为 1:1 (正方形) ★ */
.project-img-box {
height: auto;
aspect-ratio: 1 / 1; /* 手机版强制变为正方形 */
}
/* 文字区块：维持紧贴优化 */
.project-text-area {
/* 稍微减少负边距以免盖到图片 */
margin-top: 0 !important;
padding-top: 15px !important;
padding-left: 25px;
padding-right: 25px;
padding-bottom: 30px;
}
}
精选作品
Selected Portfolio
全部作品 住宅空间 商业空间
MODERN
新民街 ・ 静谧之境
新北市淡水区｜40坪
RESIDENTIAL
沐光 ・ 静域
芦洲 黄公馆
LUXURY
淬炼 ・ 本质
林口 福华谦礼
MODERN
流动 ・ 恒久
林口 上品苑
LUXURY
静谧 ・ 归真
景美 张公馆
LUXURY
雅致 ・ 余韵
竹北 吴公馆
MODERN
人文 ・ 拾光
三峡 远雄耶鲁
ZEN
极简 ・ 纯粹
淡水 郑公馆
OFFICE
理智 ・ 境域
德菲行销
ZEN
之行 ・ 书院
之行书院
欣赏更多极境作品？
联络我们
https://www.formaveil.com/
极境室内设计有限公司
精选作品
Selected Portfolio
全部作品 住宅空间 商业空间
MODERN
新民街 ・ 静谧之境
新北市淡水区｜40坪
RESIDENTIAL
沐光 ・ 静域
芦洲 黄公馆
