操作

MediaWiki

“Common.css”的版本间差异

来自pcdiy_dev

(创建页面,内容为“→‎这里放置的CSS将应用于所有皮肤:​ .mw-editsection{ display:none; } #toc{ display:none; }”
 
 
(未显示同一用户的8个中间版本)
第5行: 第5行:
 
#toc{
 
#toc{
 
display:none;
 
display:none;
 +
}
 +
/* 更好的区分正文以及标题内容 */
 +
/*
 +
待定:h3的下划线
 +
.mw-body h3 {
 +
    border-bottom: solid #ccc 1px;
 +
}
 +
*/
 +
.mw-bodytext{
 +
    margin-top: 1.5em;
 +
    margin-left: 1em;
 +
    margin-right: 1em;
 +
}
 +
.mw-bodytext h1, h2, h3, h4, h5, h6{
 +
    margin: 0 -.7em;
 +
}
 +
.mw-body h5 {
 +
    margin-left: .5em;
 +
    margin-right: .5em;
 +
}
 +
 +
/* https://drrr.wiki/MediaWiki:Common.css */
 +
/* http://nicolasgallagher.com/micro-clearfix-hack/ */
 +
.clearfix:before,
 +
.clearfix:after {
 +
display: table;
 +
content: "";
 +
}
 +
 +
.clearfix:after {
 +
clear: both;
 +
}
 +
 +
.col {
 +
float: left;
 +
box-sizing: border-box;
 +
padding: .6rem;
 +
}
 +
 +
.col-3 {
 +
width: 25%;
 +
}
 +
 +
.col-4 {
 +
width: 33.3333%;
 +
width: calc(100% / 3);
 +
}
 +
 +
.col-6 {
 +
width: 50%;
 +
}
 +
 +
/*** *** ***/
 +
/*黑幕CSS引自萌娘百科(https://zh.moegirl.org/),文字内容遵守【知识共享 署名-非商业性使用-相同方式共享 3.0】协议。*/
 +
/* 黑幕模板配合CSS */
 +
/* 把这几行单独拎出来写,否则会被Firefox合并到“.heimu a”这条规则,然后又被上面的“点过外链不变色”规则override */
 +
span.heimu a.external,
 +
span.heimu a.external:visited,
 +
span.heimu a.extiw,
 +
span.heimu a.extiw:visited {
 +
  color: #252525;
 +
}
 +
 +
.heimu,
 +
.heimu a,
 +
a .heimu,
 +
.heimu a.new {
 +
  background-color: #252525;
 +
  color: #252525;
 +
  text-shadow: none;
 +
}
 +
 +
body:not(.heimu_toggle_on) .heimu:hover,
 +
body:not(.heimu_toggle_on) .heimu:active,
 +
body:not(.heimu_toggle_on) .heimu.off {
 +
  transition: color .13s linear;
 +
  color: white;
 +
}
 +
 +
body:not(.heimu_toggle_on) .heimu:hover .heimugray,
 +
body:not(.heimu_toggle_on) .heimu:active .heimugray,
 +
body:not(.heimu_toggle_on) .heimu.off .heimugray{
 +
  transition: color .13s linear;
 +
  color: #666666;
 +
}
 +
 +
body:not(.heimu_toggle_on) .heimu:hover a,
 +
body:not(.heimu_toggle_on) a:hover .heimu,
 +
body:not(.heimu_toggle_on) .heimu.off a,
 +
body:not(.heimu_toggle_on) a:hover .heimu.off {
 +
  transition: color .13s linear;
 +
  color: lightblue;
 +
}
 +
 +
body:not(.heimu_toggle_on) .heimu.off .new,
 +
body:not(.heimu_toggle_on) .heimu.off .new:hover,
 +
body:not(.heimu_toggle_on) .new:hover .heimu.off,
 +
body:not(.heimu_toggle_on) .heimu.off .new,
 +
body:not(.heimu_toggle_on) .heimu.off .new:hover,
 +
body:not(.heimu_toggle_on) .new:hover .heimu.off {
 +
  transition: color .13s linear;
 +
  color: #BA0000;
 +
}
 +
.col-12 {
 +
width: 100%;
 +
}
 +
 +
.col.gray { background: #f1f1f1; }
 +
.col.yellow { background: #FDF5EB; }
 +
.col.blue { background: #EBF8FD; }
 +
 +
@media (max-width: 800px) {
 +
.col-3 {
 +
width: 50%;
 +
}
 +
 +
.col-4,
 +
.col-6 {
 +
width: 100%;
 +
}
 +
}
 +
 +
.multi-col-list { }
 +
 +
@media (min-width: 481px) {
 +
.multi-col-list ul {
 +
margin: 0;
 +
}
 +
 +
.multi-col-list li {
 +
display: inline-block;
 +
width: 49%;
 +
}
 +
}
 +
 +
@media (min-width: 801px) {
 +
.multi-col-list ul {
 +
margin: 0;
 +
}
 +
 +
.multi-col-list li {
 +
display: inline-block;
 +
width: 19%;
 +
}
 +
}
 +
 +
 +
@media (min-width: 1001px) {
 +
.multi-col-list ul {
 +
margin: 0;
 +
}
 +
 +
.multi-col-list li {
 +
display: inline-block;
 +
width: 15%;
 +
}
 +
}
 +
 +
.column { }
 +
 +
.column-2 { column-count: 2; }
 +
.column-3 { column-count: 3; }
 +
.column-4 { column-count: 4; }
 +
.column-5 { column-count: 5; }
 +
.column-6 { column-count: 6; }
 +
 +
@media (max-width: 800px) {
 +
.column-2 { column-count: 1; }
 +
.column-3 { column-count: 2; }
 +
.column-4 { column-count: 2; }
 +
.column-5 { column-count: 3; }
 +
.column-6 { column-count: 4; }
 +
}
 +
 +
@media (max-width: 500px) {
 +
.column-2 { column-count: 1; }
 +
.column-3 { column-count: 1; }
 +
.column-4 { column-count: 2; }
 +
.column-5 { column-count: 2; }
 +
.column-6 { column-count: 2; }
 
}
 
}

2022年6月27日 (一) 19:27的最新版本

/* 这里放置的CSS将应用于所有皮肤 */
.mw-editsection{
	display:none;
}
#toc{
	display:none;
}
/* 更好的区分正文以及标题内容 */
/*
待定:h3的下划线
.mw-body h3 {
    border-bottom: solid #ccc 1px;
}
 */
.mw-bodytext{
    margin-top: 1.5em;
    margin-left: 1em;
    margin-right: 1em;
}
.mw-bodytext h1, h2, h3, h4, h5, h6{
    margin: 0 -.7em;
}
.mw-body h5 {
    margin-left: .5em;
    margin-right: .5em;
}

/* https://drrr.wiki/MediaWiki:Common.css */
/* http://nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before,
.clearfix:after {
	display: table;
	content: "";
}

.clearfix:after {
	clear: both;
}

.col {
	float: left;
	box-sizing: border-box;
	padding: .6rem;
}

.col-3 {
	width: 25%;
}

.col-4 {
	width: 33.3333%;
	width: calc(100% / 3);
}

.col-6 {
	width: 50%;
}

/*** *** ***/
/*黑幕CSS引自萌娘百科(https://zh.moegirl.org/),文字内容遵守【知识共享 署名-非商业性使用-相同方式共享 3.0】协议。*/
/* 黑幕模板配合CSS */
/* 把这几行单独拎出来写,否则会被Firefox合并到“.heimu a”这条规则,然后又被上面的“点过外链不变色”规则override */
span.heimu a.external,
span.heimu a.external:visited,
span.heimu a.extiw,
span.heimu a.extiw:visited {
  color: #252525;
}

.heimu,
.heimu a,
a .heimu,
.heimu a.new {
  background-color: #252525;
  color: #252525;
  text-shadow: none;
}

body:not(.heimu_toggle_on) .heimu:hover,
body:not(.heimu_toggle_on) .heimu:active,
body:not(.heimu_toggle_on) .heimu.off {
  transition: color .13s linear;
  color: white;
}

body:not(.heimu_toggle_on) .heimu:hover .heimugray,
body:not(.heimu_toggle_on) .heimu:active .heimugray,
body:not(.heimu_toggle_on) .heimu.off .heimugray{
  transition: color .13s linear;
  color: #666666;
}

body:not(.heimu_toggle_on) .heimu:hover a,
body:not(.heimu_toggle_on) a:hover .heimu,
body:not(.heimu_toggle_on) .heimu.off a,
body:not(.heimu_toggle_on) a:hover .heimu.off {
  transition: color .13s linear;
  color: lightblue;
}

body:not(.heimu_toggle_on) .heimu.off .new,
body:not(.heimu_toggle_on) .heimu.off .new:hover,
body:not(.heimu_toggle_on) .new:hover .heimu.off,
body:not(.heimu_toggle_on) .heimu.off .new,
body:not(.heimu_toggle_on) .heimu.off .new:hover,
body:not(.heimu_toggle_on) .new:hover .heimu.off {
  transition: color .13s linear;
  color: #BA0000;
}
.col-12 {
	width: 100%;
}

.col.gray { background: #f1f1f1; }
.col.yellow { background: #FDF5EB; }
.col.blue { background: #EBF8FD; }

@media (max-width: 800px) {
	.col-3 {
		width: 50%;
	}
	
	.col-4,
	.col-6 {
		width: 100%;
	}
}

.multi-col-list { }

@media (min-width: 481px) {
	.multi-col-list ul {
		margin: 0;
	}

	.multi-col-list li {
		display: inline-block;
		width: 49%;
	}
}

@media (min-width: 801px) {
	.multi-col-list ul {
		margin: 0;
	}

	.multi-col-list li {
		display: inline-block;
		width: 19%;
	}
}


@media (min-width: 1001px) {
	.multi-col-list ul {
		margin: 0;
	}

	.multi-col-list li {
		display: inline-block;
		width: 15%;
	}
}

.column { }

.column-2 { column-count: 2; }
.column-3 { column-count: 3; }
.column-4 { column-count: 4; }
.column-5 { column-count: 5; }
.column-6 { column-count: 6; }

@media (max-width: 800px) {
	.column-2 { column-count: 1; }
	.column-3 { column-count: 2; }
	.column-4 { column-count: 2; }
	.column-5 { column-count: 3; }
	.column-6 { column-count: 4; }
}

@media (max-width: 500px) {
	.column-2 { column-count: 1; }
	.column-3 { column-count: 1; }
	.column-4 { column-count: 2; }
	.column-5 { column-count: 2; }
	.column-6 { column-count: 2; }
}