작은숲:위키노트/CSS: 두 판 사이의 차이
잔글
Utolee90님이 위키노트:CSS 문서를 넘겨주기를 만들지 않고 작은숲:위키노트/CSS 문서로 이동했습니다: 위키노트 문서 작은숲으로 이동
잔글 (문자열 찾아 바꾸기 - "분류:공유" 문자열을 "분류:위키노트/공유" 문자열로) |
잔글 (Utolee90님이 위키노트:CSS 문서를 넘겨주기를 만들지 않고 작은숲:위키노트/CSS 문서로 이동했습니다: 위키노트 문서 작은숲으로 이동) |
||
| (같은 사용자의 중간 판 3개는 보이지 않습니다) | |||
| 1번째 줄: | 1번째 줄: | ||
== 활용 == | == 활용 == | ||
=== 나열된 객체의 짝수번째, 홀수번째 선택자 === | === 나열된 객체의 짝수번째, 홀수번째 선택자 === | ||
< | <syntaxhighlight lang="css"> | ||
tr:nth-child(odd) { background-color:#fbfbfb; } | tr:nth-child(odd) { background-color:#fbfbfb; } | ||
tr:nth-child(even) { } | tr:nth-child(even) { } | ||
</ | </syntaxhighlight> | ||
=== 속성 선택자 === | === 속성 선택자 === | ||
< | <syntaxhighlight lang="css"> | ||
input[type="text"], input[name="value"] { border:1px solid #ccc; padding:4px 4px; border-radius:3px; outline:none; } | input[type="text"], input[name="value"] { border:1px solid #ccc; padding:4px 4px; border-radius:3px; outline:none; } | ||
input[type="checkbox"] { position:relative; top:2px; margin-right:4px; } | input[type="checkbox"] { position:relative; top:2px; margin-right:4px; } | ||
</ | </syntaxhighlight> | ||
=== 나눔고딕 글꼴 크기 === | === 나눔고딕 글꼴 크기 === | ||
< | <syntaxhighlight lang="css"> | ||
body { | body { | ||
font-size: 13px; | font-size: 13px; | ||
font-family: 'Segoe UI', /*'Meiryo UI',*/ NanumGothic, NanumBarunGothic, 'Malgun Gothic', Dotum, 'Apple SD Gothic Neo', AppleGothic, Helvetica, sans-serif; | font-family: 'Segoe UI', /*'Meiryo UI',*/ NanumGothic, NanumBarunGothic, 'Malgun Gothic', Dotum, 'Apple SD Gothic Neo', AppleGothic, Helvetica, sans-serif; | ||
-webkit-font-smoothing: antialiased; | -webkit-font-smoothing: antialiased; | ||
}</ | }</syntaxhighlight> | ||
[[위키노트 | [[작은숲:위키노트/글꼴|글꼴]] 크기를 15px로 할 때는 나눔바른고딕이 나은 것 같고, 13px로 할 때는 [[나눔고딕]]이 나은 것 같다. | ||
=== 글꼴을 나눔고딕으로 할 때 제목 등 굵은 글꼴 깔끔하게 === | === 글꼴을 나눔고딕으로 할 때 제목 등 굵은 글꼴 깔끔하게 === | ||
< | <syntaxhighlight lang="css"> | ||
h1 { font-weight:800; } | h1 { font-weight:800; } | ||
h2 { font-weight:600; } | h2 { font-weight:600; } | ||
</ | </syntaxhighlight> | ||
문서 제목은 <tt>font-weight</tt>를 <tt>800</tt> 정도 해주는 것이 적당하고, 본문 제목의 경우는 <tt>600</tt> 정도로 해주는 것이 좋다. | 문서 제목은 <tt>font-weight</tt>를 <tt>800</tt> 정도 해주는 것이 적당하고, 본문 제목의 경우는 <tt>600</tt> 정도로 해주는 것이 좋다. | ||
== 같이 보기 == | == 같이 보기 == | ||
* [[위키노트 | * [[작은숲:위키노트/CSS 선택자|CSS 선택자]] | ||
* [[위키노트 | * [[작은숲:위키노트/CSS 애니메이션|CSS 애니메이션]] | ||
== 참고 == | == 참고 == | ||
* [http://www.w3.org/Style/Examples/007/evenodd CSS: Even and Odd Rules] | * [http://www.w3.org/Style/Examples/007/evenodd CSS: Even and Odd Rules] | ||