笔记本移动端

public/static/index/mobile/css/topic_laptop/xn.css

@@ -0,0 +1,52 @@
+.xn-container {
+	width: 6.8rem;
+	margin: 0 auto;
+	box-sizing: border-box;
+}
+
+/* 图片容器样式（核心） */
+.xn-image-section {
+	overflow: hidden;
+	border-radius: 0.16rem;
+	background: #0d0c10;
+	border: 1px solid #3f3f45;
+	width: 6.8rem;
+}
+
+.zoom-image {
+	width: 100%;
+	height: auto;
+	display: block;
+	/* 调整transform过渡时间为2s，opacity为1.5s，可按需修改 */
+	transition: transform 2s cubic-bezier(0.25, 0.1, 0.25, 1), opacity 1.5s ease;
+	transform: scale(0.8);
+	/* 初始缩放比例 */
+	opacity: 0.9;
+	/* 初始透明度（略暗，放大后变亮） */
+}
+
+/* 滚动触发后的放大状态 */
+.zoom-image.active {
+	transform: scale(1.1);
+	/* 放大5%（官网常用比例，不夸张） */
+	opacity: 1;
+}
+.xn-t {
+	font-size: 0.36rem;
+	color: #fff;
+	text-align: center;
+	margin-top: 1.5rem;
+	margin-bottom: 0.6rem;
+}
+.xn-p {
+	width: 6.8rem;
+	padding-top: 0.6rem;
+	padding-left: 0.11rem;
+	font-size: 0.16rem;
+	margin: 0 auto;
+}
+.xn-p p {
+	color: #cbcfd8;
+	text-align: left;
+	line-height: 1.5;
+}