用户:Prion/common.css
外观
注意:在发布之后,您可能需要清除浏览器缓存才能看到所作出的更改的影响。
- Firefox或Safari:按住Shift的同时单击刷新,或按Ctrl-F5或Ctrl-R(Mac为⌘-R)
- Google Chrome:按Ctrl-Shift-R(Mac为⌘-Shift-R)
- Edge:按住Ctrl的同时单击刷新,或按Ctrl-F5。
/* =·=·=·=·=·=·=·=·=· RESET ·=·=·=·=·=·=·=·=·= */
* {
position: static;
box-sizing:border-box;
padding:0;
margin:0;
}
html body {
font-size: 16px;
}
/* =·=·=·=·=·=·=·=·=· CLEAR USELESS ELEMENTS ·=·=·=·=·=·=·=·=·= */
.noprint {
display: none;
}
@media screen and (min-width: 900px) {
/* =========================== LAYOUTS =========================== */
/* ---- (1) mediawiki LAYOUT ---- */
.mediawiki {
display: grid;
grid-template-columns: 1fr 7fr 1fr;
grid-template-rows: 300px auto 100px;
}
.mw-body{
grid-column: 2 / 3;
grid-row: 2 / 3 ;
}
#mw-navigation{
grid-column: 2 / 3;
grid-row: 1 / 2;
}
.mw-footer {
grid-column: 2 / 3;
grid-row: 3 / 4;
}
/* ---- (1.1) mw-navigation LAYOUT ---- */
#mw-navigation {
display: grid;
grid-template-columns: 1fr 8fr 1fr;
grid-template-rows: 40px 200px 20px 40px;
}
#mw-panel,
#mw-head {
position: static;
}
#left-navigation,
#right-navigation{
box-sizing: border-box;
margin:0;
}
#mw-head {
grid-column: 1 / 4;
grid-row: 4 / 5;
}
#mw-panel {
grid-column: 2 / 3;
grid-row: 2 / 3;
}
/* ---- (1.1.1) mw-head LAYOUT ---- */
#p-personal {
position: fixed;
top:0;
right: 22%;
height: 37px;
}
#p-personal .vector-menu-content{
height: 100%;
}
#p-personal .vector-menu-content ul {
height: 100%;
align-items: center;
}
#p-search {
margin: 0;
position: fixed;
top: 0;
right: 1.5%;
}
/* ---- (1.1.2) mw-panel LAYOUT ---- */
#mw-panel {
margin: 0;
padding:0;
width:100%;
display: grid;
grid-template-columns: 200px repeat(5, minmax(100px, 1fr));
grid-template-rows: 160px 40px;
}
#p-logo {
grid-column: 1 / 2;
grid-row: 1 / 3;
margin:0;
width: auto;
height: auto;
}
#p-logo a {
width: 100%;
height: 100%;
}
#p-navigation {
grid-column: 2 / 3;
grid-row: 2 / 3 ;
}
#p-学习园地{
grid-column: 3 / 4;
grid-row: 2 / 3 ;
}
#p-论坛百科{
grid-column: 4 / 5;
grid-row: 2 / 3 ;
}
#p-维基事务{
grid-column: 5 / 6;
grid-row: 2 / 3 ;
}
#p-tb{
grid-column: 6 / 7;
grid-row: 2 / 3 ;
}
#p-logo + .mw-portlet .vector-menu-heading {
display: block;
}
.portal {
position: relative;
margin:0;
padding:0;
}
.portal .vector-menu-heading {
margin:0;
height: 100%;
}
.portal .vector-menu-heading-label {
display: inline-block;
padding: 5.4% 0;
}
.portal .vector-menu-content{
display: none;
position: absolute;
top: 100%;
left: 0;
width: max-content;
min-width: 100px;
}
.portal:hover .vector-menu-content{
display: block;
}
/* ---- (1.2) mw-body LAYOUT ---- */
#content {
z-index: 0;
}
.mw-body {
box-sizing: border-box;
margin:0;
}
/* =========================== STYLES =========================== */
.mediawiki {
background: none !important;
}
#content {
font-size: 1rem;
}
/* ---- p-personal ---- */
#p-personal li {
font-size: 0.875rem;
}
/* ---- wm-head --- */
/* clear all borders and backgrounds of mw-head */
.vector-menu-tabs,
.vector-menu-tabs a,
.vector-menu-tabs-legacy .selected,
.vector-menu-tabs-legacy li a,
.vector-menu-tabs-legacy li,
#mw-head .vector-menu-dropdown .vector-menu-heading{
background: none;
border: none;
}
/* ---- mw-panel ---- */
.portal .vector-menu-heading {
font-size: 1rem;
text-align: center;
background: none;
}
.portal .vector-menu-heading:hover {
}
.portal .vector-menu-content li {
font-size: 1rem;
}
.portal:hover .vector-menu-content{
background-color: red;
}
/* 右边的三角形图标
.portal::after {
content:"";
--mask: var() no-repeat;
webkit-mask: var(--mask);
mask: var(--mask);
} */
}
@media screen and (max-width: 900px) {
}