MediaWiki:Common.css - 版本历史

2025年8月13日 (三) 16:23 9Yan

2025-08-13T16:23:52Z

←上一版本		2025年8月14日 (四) 00:23的版本
第41行：		第41行：

	/* hr */		/* hr */
	hr {		.mw-content-ltr {
			position: relative;
			}
			.mw-content-ltr hr {
	margin-block-start: 2em;		margin-block-start: 2em;
	margin-block-end: 2em;		margin-block-end: 2em;
第49行：		第52行：
	}		}

	hr::after {		.mw-content-ltr hr::after {
	content: 'ℋ';		content: 'ℋ';
	display: inline-block;		display: inline-block;

2025年8月13日 (三) 16:19 9Yan

2025-08-13T16:19:16Z

@@ 第22行： / 第22行： @@
+}
 @media (max-width: 1200px) {
    .CategoryTreeTag {
@@ 第39行： / 第38行： @@
      columns: 1;
+   }
+}

2025年8月11日 (一) 07:07 9Yan

2025-08-11T07:07:06Z

←上一版本		2025年8月11日 (一) 15:07的版本
第18行：		第18行：
	/* CategoryTreeTag */		/* CategoryTreeTag */
	.CategoryTreeTag {		.CategoryTreeTag {
	~~display: grid;~~		columns: 4; /* 将内容分成4列 */
	~~grid-auto-flow: column; /* 按列填充 */~~		column-gap: 1em; /* 列之间的间距 */
	~~grid-template-~~columns: ~~repeat(~~4~~, 1fr)~~; /* ~~显式定义4列，让每列等宽~~ */
	~~grid~~-~~template-rows~~: ~~repeat(auto-fill, minmax(20px, 1fr))~~; /* ~~关键：让行数自动适应~~ */
	~~gap: 1em;~~
	}		}

第28行：		第25行：
	@media (max-width: 1200px) {		@media (max-width: 1200px) {
	.CategoryTreeTag {		.CategoryTreeTag {
	~~grid-template-~~columns: ~~repeat(~~3~~, 1fr)~~;		columns: 3;
	}		}
	}		}
第34行：		第31行：
	@media (max-width: 768px) {		@media (max-width: 768px) {
	.CategoryTreeTag {		.CategoryTreeTag {
	~~grid-template-~~columns: ~~repeat(~~2~~, 1fr)~~;		columns: 2;
	}		}
	}		}
第40行：		第37行：
	@media (max-width: 480px) {		@media (max-width: 480px) {
	.CategoryTreeTag {		.CategoryTreeTag {
	~~grid-template-~~columns: ~~1fr~~;		columns: 1;
	}		}
	}		}

2025年8月11日 (一) 07:05 9Yan

2025-08-11T07:05:27Z

←上一版本		2025年8月11日 (一) 15:05的版本
第19行：		第19行：
	.CategoryTreeTag {		.CategoryTreeTag {
	display: grid;		display: grid;
			grid-auto-flow: column; /* 按列填充 */
			grid-template-columns: repeat(4, 1fr); /* 显式定义4列，让每列等宽 */
			grid-template-rows: repeat(auto-fill, minmax(20px, 1fr)); /* 关键：让行数自动适应 */
	gap: 1em;		gap: 1em;
	~~grid-template-columns: repeat(4, 1fr);~~
	}		}

	/* ~~针对不同屏幕宽度的响应式布局~~ */		/* 响应式设计 */
	@media (max-width: 1200px) {		@media (max-width: 1200px) {
	.CategoryTreeTag {		.CategoryTreeTag {
	grid-template-columns: repeat(3, 1fr); ~~/* 屏幕变窄，改为3列 */~~		grid-template-columns: repeat(3, 1fr);
	}		}
	}		}
第32行：		第34行：
	@media (max-width: 768px) {		@media (max-width: 768px) {
	.CategoryTreeTag {		.CategoryTreeTag {
	grid-template-columns: repeat(2, 1fr); ~~/* 屏幕更窄，改为2列 */~~		grid-template-columns: repeat(2, 1fr);
	}		}
	}		}
第38行：		第40行：
	@media (max-width: 480px) {		@media (max-width: 480px) {
	.CategoryTreeTag {		.CategoryTreeTag {
	grid-template-columns: 1fr; ~~/* 手机屏幕，改为1列 */~~		grid-template-columns: 1fr;
	}		}
	}		}

2025年8月11日 (一) 07:02 9Yan

2025-08-11T07:02:18Z

←上一版本		2025年8月11日 (一) 15:02的版本
第19行：		第19行：
	.CategoryTreeTag {		.CategoryTreeTag {
	display: grid;		display: grid;
	~~grid-auto-flow: column; /* 关键：让项目垂直排列，然后换列 */~~		gap: 1em;
	gap: 1em; ~~/* 项目之间的间距 */~~

	~~/* 默认情况下，有足够的空间时显示4列 */~~
	grid-template-columns: repeat(4, 1fr);		grid-template-columns: repeat(4, 1fr);
	~~grid-template-rows: repeat(3, auto);~~
	}		}

第30行：		第26行：
	@media (max-width: 1200px) {		@media (max-width: 1200px) {
	.CategoryTreeTag {		.CategoryTreeTag {
	grid-template-columns: repeat(3, 1fr);		grid-template-columns: repeat(3, 1fr); /* 屏幕变窄，改为3列 */
	~~grid-template-rows: repeat(4, auto);~~
	}		}
	}		}
第37行：		第32行：
	@media (max-width: 768px) {		@media (max-width: 768px) {
	.CategoryTreeTag {		.CategoryTreeTag {
	grid-template-columns: repeat(2, 1fr);		grid-template-columns: repeat(2, 1fr); /* 屏幕更窄，改为2列 */
	~~grid-template-rows: repeat(6, auto);~~
	}		}
	}		}
第44行：		第38行：
	@media (max-width: 480px) {		@media (max-width: 480px) {
	.CategoryTreeTag {		.CategoryTreeTag {
	grid-template-columns: 1fr;		grid-template-columns: 1fr; /* 手机屏幕，改为1列 */
	~~grid-template-rows: repeat(12, auto);~~
	}		}
	}		}

2025年8月11日 (一) 06:55 9Yan

2025-08-11T06:55:50Z

←上一版本		2025年8月11日 (一) 14:55的版本
第18行：		第18行：
	/* CategoryTreeTag */		/* CategoryTreeTag */
	.CategoryTreeTag {		.CategoryTreeTag {
	display: ~~flex~~;		display: grid;
	~~flex~~-~~wrap~~: ~~wrap~~; /* ~~允许项目换行~~ */		grid-auto-flow: column; /* 关键：让项目垂直排列，然后换列 */
	gap: 1em; /* ~~设置项目之间的间距~~ */		gap: 1em; /* 项目之间的间距 */
	}

	~~.CategoryTreeTag > .CategoryTreeSection {~~		/* 默认情况下，有足够的空间时显示4列 */
	~~flex~~-~~grow~~: 1; ~~/* 允许项目在空间充足时增长 */~~		grid-template-columns: repeat(4, 1fr);
	~~flex~~-~~basis~~: ~~250px~~; ~~/* 设置项目的最小宽度 */~~		grid-template-rows: repeat(3, auto);
	}		}

	/* 针对不同屏幕宽度的响应式布局 */		/* 针对不同屏幕宽度的响应式布局 */
	@media (max-width: ~~1024px~~) {		@media (max-width: 1200px) {
	.CategoryTreeTag ~~> .CategoryTreeSection~~ {		.CategoryTreeTag {
	~~flex~~-~~basis~~: ~~300px~~; ~~/* 中等屏幕下每个项目的最小宽度 */~~		grid-template-columns: repeat(3, 1fr);
			grid-template-rows: repeat(4, auto);
	}		}
	}		}

	@media (max-width: 768px) {		@media (max-width: 768px) {
	.CategoryTreeTag ~~> .CategoryTreeSection~~ {		.CategoryTreeTag {
	~~flex~~-~~basis~~: ~~400px~~; ~~/* 平板屏幕下每个项目的最小宽度 */~~		grid-template-columns: repeat(2, 1fr);
			grid-template-rows: repeat(6, auto);
	}		}
	}		}

	@media (max-width: 480px) {		@media (max-width: 480px) {
	.CategoryTreeTag ~~> .CategoryTreeSection~~ {		.CategoryTreeTag {
	~~flex~~-~~basis~~: ~~100%~~; ~~/* 小屏幕（手机）下每个项目占满一行 */~~		grid-template-columns: 1fr;
			grid-template-rows: repeat(12, auto);
	}		}
	}		}

2025年8月11日 (一) 06:54 9Yan

2025-08-11T06:54:01Z

@@ 第14行： / 第14行： @@
 .end-coordinate {
 	color: purple;
+}

2025年8月3日 (日) 13:05 9Yan

2025-08-03T13:05:35Z

@@ 第1行： / 第1行： @@
 /* 这里放置的CSS将应用于所有皮肤 */
 /* 隐藏分类页面的子页面 */
 .mw-category-generated { display: none; }
 .overworld-coordinate {

2025年8月3日 (日) 13:01 9Yan

2025-08-03T13:01:08Z

←上一版本		2025年8月3日 (日) 21:01的版本
第35行：		第35行：
	padding: 0;		padding: 0;
	overflow: hidden;		overflow: hidden;
			}

			.infobox .infobox-img img {
			height: auto;
	}		}

2025年8月3日 (日) 13:00 9Yan

2025-08-03T13:00:38Z

←上一版本		2025年8月3日 (日) 21:00的版本
第37行：		第37行：
	}		}

	~~.infobox .infobox-img img {~~
	~~max-width: 350px;~~
	~~height: auto;~~
	}
	.infobox .infobox-img td {		.infobox .infobox-img td {
	display: flex;		display: flex;