미디어위키:Common.css
기술노트
참고: 설정을 저장한 후에 바뀐 점을 확인하기 위해서는 브라우저의 캐시를 새로 고쳐야 합니다.
- 파이어폭스 / 사파리: Shift 키를 누르면서 새로 고침을 클릭하거나, Ctrl-F5 또는 Ctrl-R을 입력 (Mac에서는 ⌘-R)
- 구글 크롬: Ctrl-Shift-R키를 입력 (Mac에서는 ⌘-Shift-R)
- 인터넷 익스플로러 / 엣지: Ctrl 키를 누르면서 새로 고침을 클릭하거나, Ctrl-F5를 입력.
- 오페라: Ctrl-F5를 입력.
/* ========== 기본 폰트 (나무위키 스타일) ========== */
html, body, #content, #mw-content-text, .mw-body {
font-family:
"Malgun Gothic", "맑은 고딕", /* Windows 우선 */
"Apple SD Gothic Neo", /* macOS */
"Noto Sans KR", /* Linux/Chrome */
"Helvetica Neue", Helvetica, Arial,
"Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji",
sans-serif !important;
font-size: 15px; /* 나무위키는 15px 사용 */
line-height: 1.7; /* 더 넓은 줄간격 */
font-weight: 400; /* 기본 굵기 */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
color: #373a3c; /* 나무위키 본문 색상 */
}
/* ========== 페이지 제목(문서 최상단 H1) ========== */
#firstHeading, .mw-body h1.firstHeading {
font-size: 1.75rem; /* ≈ 28px */
font-weight: 600; /* 나무위키는 살짝 더 가늘게 */
color: #000; /* 제목은 완전 검정 */
margin-bottom: .8rem;
letter-spacing: -0.5px; /* 자간 조정 */
}
/* ========== 섹션 제목(H2/H3) 스타일 ========== */
.mw-body h2 {
font-size: 1.375rem; /* ≈ 22px */
font-weight: 600;
color: #000;
border-bottom: 2px solid #00a495; /* 나무위키 특유의 초록색 */
padding-bottom: .3rem;
margin-top: 1.8rem;
margin-bottom: 1rem;
letter-spacing: -0.3px;
}
.mw-body h2 .mw-headline {
font-weight: 600;
color: #000;
}
.mw-body h3 {
font-size: 1.125rem; /* ≈ 18px */
font-weight: 600;
color: #000;
margin-top: 1.4rem;
margin-bottom: .6rem;
letter-spacing: -0.2px;
}
.mw-body h3 .mw-headline {
font-weight: 600;
color: #000;
}
/* ========== 본문 가독성 보정 ========== */
.mw-body-content p {
margin: .7rem 0;
letter-spacing: -0.2px;
line-height: 1.7;
}
b, strong {
font-weight: 600; /* 나무위키는 700보다 살짝 가늘게 */
color: #000;
}
i, em { font-style: italic; }
/* ========== 링크 색상(나무위키 스타일) ========== */
.mw-body a {
color: #00a495; /* 나무위키 특유의 청록색 */
text-decoration: none;
}
.mw-body a:hover {
color: #008577; /* 호버시 더 진한 색 */
text-decoration: underline;
}
.mw-body a:visited {
color: #7b68ee; /* 방문한 링크는 보라색 계열 */
}
/* ========== 리스트/테이블 약간의 간격 보정 ========== */
.mw-body ul, .mw-body ol {
margin: .5rem 0 .8rem 1.5rem;
line-height: 1.6;
}
.mw-body li {
margin-bottom: .2rem;
}
.mw-body .wikitable {
font-size: 0.875rem; /* 표는 더 작게 */
border-collapse: collapse;
margin: 1rem 0;
}
/* ========== 나무위키 특유의 디자인 요소 ========== */
.mw-body blockquote {
border-left: 3px solid #00a495;
padding-left: 1rem;
margin: 1rem 0;
font-style: italic;
color: #555;
}
/* ========== 코드/인용구 스타일 ========== */
code {
font-family: "Consolas", "Monaco", "Courier New", monospace;
background-color: #f5f5f5;
padding: 0.2rem 0.4rem;
border-radius: 3px;
font-size: 0.9em;
}
pre {
background-color: #f8f9fa;
border: 1px solid #e9ecef;
border-radius: 4px;
padding: 1rem;
overflow-x: auto;
font-size: 0.875rem;
}