style:修改首页,产品详情,新品,nasr首页样式

refactor:重构了产品详情的图片预览功能,coyp了一个页面
add:新增了large.js这个是产品详情图片预览相关的
This commit is contained in:
2025-05-10 17:33:35 +08:00
parent 999c8adc9d
commit b7c79da318
21 changed files with 860 additions and 138 deletions

View File

@@ -7,11 +7,14 @@
overflow-x: hidden;
background: #f9f9f9;
}
.oricoCont{
background: #f9f9f9;
}
.orico_Page_newproducts p,
.orico_Page_newproducts a,
.orico_Page_newproducts div,
.orico_Page_newproducts span {
font-family: "Microsoft YaHei", "Arial", sans-serif;
font-family: 'Microsoft YaHei', 'Arial', sans-serif;
}
.orico_Page_newproducts .opdBanner {
width: 100%;
@@ -25,21 +28,49 @@
object-fit: cover;
transition: opacity 1s ease-in-out;
}
.orico_Page_newproducts .opdbanner>a:first-child {
.orico_Page_newproducts .opdbanner > a:first-child {
display: block;
}
.orico_Page_newproducts .oricoNewPrMain {
width: 85%;
padding: 50px 0 10px;
padding: 7.5rem 0 10px;
margin: 0 auto;
display: flex;
flex-direction: column;
}
.orico_Page_newproducts .oricoNewPrMain .cat {
margin-bottom: 3.75rem;
}
.orico_Page_newproducts .oricoNewPrMain .ori-pd-title {
font-size: 1.5em;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
}
.orico_Page_newproducts .oricoNewPrMain .ori-pd-title .catname {
font-size: 1.5rem;
color: #101010;
margin-bottom: 1.25rem;
}
.orico_Page_newproducts .oricoNewPrMain .ori-pd-title .catmore {
display: flex;
flex-direction: row;
align-items: center;
margin-right: 1%;
}
.orico_Page_newproducts .oricoNewPrMain .ori-pd-title .catmore .tmore {
font-size: 1rem;
color: #444;
font-weight: 500;
}
.orico_Page_newproducts .oricoNewPrMain .ori-pd-title .catmore .catmoreImg {
width: 1.75rem;
height: 1.75rem;
margin-left: 0.5rem;
}
.orico_Page_newproducts .oricoNewPrMain .ori-pd-list {
display: flex;
flex-wrap: wrap; /* 自动换行 */
@@ -87,16 +118,32 @@
color: #444;
font-size: 0.875rem;
padding-bottom: 0.625rem;
width: 100%;
text-align: center;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
width: 80%;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.orico_Page_newproducts .oricoNewPrMain .ori-pd-list .oripditem .prddec {
font-size: 0.875rem;
color: #737373;
}
.orico_Page_newproducts .oricoNewPrMain .ori-pd-list .oripditem .newcp {
width: 72px;
height: 30px;
background: #df2c39;
font-size: 12px;
color: #fff;
text-align: center;
line-height: 30px;
position: absolute;
top: 0px;
left: 50%;
transform: translate(-50%, 0%);
}
.orico_Page_newproducts .oricoNewPrMain .ori-pd-list .oripditem:hover {
box-shadow: 0px 5px 35px rgba(227, 227, 227, 0.75);
transform: translate3d(0, -2px, 0);