[Script Info]
Title: 
[Events]
Format: Layer, Start, End, Style, Name, MarginL, MarginR, MarginV, Effect, Text
Dialogue: 0,0:00:00.00,0:00:03.68,Default,,0000,0000,0000,,CSS는 글자 크기를\N조정할 때도 쓸 수 있어요
Dialogue: 0,0:00:03.68,0:00:07.55,Default,,0000,0000,0000,,이 페이지의 헤딩을 보면\N문단에 비해서
Dialogue: 0,0:00:07.55,0:00:09.38,Default,,0000,0000,0000,,이미 브라우저는\N제공하고 있어요
Dialogue: 0,0:00:09.38,0:00:12.35,Default,,0000,0000,0000,,다른 요소마다 다른 크기를 가진 \N기본 스타일을 말이죠
Dialogue: 0,0:00:12.35,0:00:13.88,Default,,0000,0000,0000,,바디 부분 글자 크기가 있고요
Dialogue: 0,0:00:13.88,0:00:16.24,Default,,0000,0000,0000,,헤딩의 각 단계에서는\N크기가 더 커지죠
Dialogue: 0,0:00:16.24,0:00:18.93,Default,,0000,0000,0000,,가끔은 이런 크기들도\N수정하고 싶을 때가 있죠
Dialogue: 0,0:00:18.93,0:00:22.43,Default,,0000,0000,0000,,CSS의 글자 크기 속성을\N이용하면 할 수 있어요
Dialogue: 0,0:00:22.43,0:00:23.85,Default,,0000,0000,0000,,예를 들자면
Dialogue: 0,0:00:23.85,0:00:28.98,Default,,0000,0000,0000,,이 페이지의 모든 글자를\N살짝 작게 만들고 싶다면요?
Dialogue: 0,0:00:28.98,0:00:31.13,Default,,0000,0000,0000,,'style' 태그로 가볼게요
Dialogue: 0,0:00:31.13,0:00:34.89,Default,,0000,0000,0000,,여기서 'body'부분에\NCSS 규칙을 추가해 줄게요
Dialogue: 0,0:00:34.89,0:00:39.54,Default,,0000,0000,0000,,그 안에 'font-size' 속성을\N넣어주세요
Dialogue: 0,0:00:39.54,0:00:42.98,Default,,0000,0000,0000,,그럼 'font-size'의 값은\N뭐가 될까요?
Dialogue: 0,0:00:42.98,0:00:45.97,Default,,0000,0000,0000,,글자 크기를\N어떻게 측정하죠?
Dialogue: 0,0:00:45.97,0:00:47.95,Default,,0000,0000,0000,,사실 이건 굉장히\N좋은 질문이에요
Dialogue: 0,0:00:47.95,0:00:50.27,Default,,0000,0000,0000,,적어도 열 개가 넘는\N단위들이 있으니까요
Dialogue: 0,0:00:50.27,0:00:52.74,Default,,0000,0000,0000,,CSS가 제공하는\N글자 크기에는 말이죠
Dialogue: 0,0:00:52.74,0:00:54.68,Default,,0000,0000,0000,,전에 봤던 단위로\N시작해볼까요
Dialogue: 0,0:00:54.68,0:00:55.85,Default,,0000,0000,0000,,'픽셀'로 말이죠
Dialogue: 0,0:00:55.85,0:00:58.62,Default,,0000,0000,0000,,이미지의 크기를 조절할 때\N픽셀 단위를 썼어요
Dialogue: 0,0:00:58.62,0:01:01.31,Default,,0000,0000,0000,,CSS에서도\N많이 사용할 거에요
Dialogue: 0,0:01:01.31,0:01:04.10,Default,,0000,0000,0000,,11픽셀이라고 해볼게요
Dialogue: 0,0:01:04.10,0:01:06.42,Default,,0000,0000,0000,,모두가 작아졌네요
Dialogue: 0,0:01:06.42,0:01:08.84,Default,,0000,0000,0000,,헤딩 부분까지도\N작아졌어요
Dialogue: 0,0:01:08.84,0:01:11.38,Default,,0000,0000,0000,,왜 헤딩도 작아지는 걸까요?
Dialogue: 0,0:01:11.38,0:01:15.22,Default,,0000,0000,0000,,브라우저가 지정해주었던\N픽셀사이즈여야 하는거 아닌가요?
Dialogue: 0,0:01:15.22,0:01:16.66,Default,,0000,0000,0000,,아니에요
Dialogue: 0,0:01:16.66,0:01:21.95,Default,,0000,0000,0000,,브라우저의 기본 헤딩은 픽셀로\N정의되어 있지 않기 때문이죠
Dialogue: 0,0:01:21.96,0:01:25.57,Default,,0000,0000,0000,,'em'이라고 부르는 단위로\N정의되어 있어요
Dialogue: 0,0:01:25.57,0:01:27.45,Default,,0000,0000,0000,,이 단위는\N상대적인 단위라서
Dialogue: 0,0:01:27.45,0:01:32.10,Default,,0000,0000,0000,,헤딩의 크기가 바디의 글자크기에\N맞추어 조절되는 거에요
Dialogue: 0,0:01:32.10,0:01:34.06,Default,,0000,0000,0000,,이게 무슨 말인지\N보여드릴게요
Dialogue: 0,0:01:34.06,0:01:36.59,Default,,0000,0000,0000,,h2 스타일 부분으로 가서
Dialogue: 0,0:01:36.59,0:01:39.45,Default,,0000,0000,0000,,글자크기 속성을 추가할게요
Dialogue: 0,0:01:39.45,0:01:44.93,Default,,0000,0000,0000,,이번엔 픽셀대신\N상대적인 크기로 해볼게요
Dialogue: 0,0:01:44.93,0:01:47.17,Default,,0000,0000,0000,,상대적으로\N얼마나 큰 지 말이죠
Dialogue: 0,0:01:47.17,0:01:50.17,Default,,0000,0000,0000,,h2를 바디에 비해\N얼마나 크게 할까요?
Dialogue: 0,0:01:50.17,0:01:53.35,Default,,0000,0000,0000,,두 배 정도 크게 해볼까요?
Dialogue: 0,0:01:53.35,0:01:57.00,Default,,0000,0000,0000,,그러려면 '2em'이라고 쓰세요
Dialogue: 0,0:01:57.00,0:02:01.84,Default,,0000,0000,0000,,여길 보면 브라우저가 글자 폰트의\N픽셀 크기를 계산하게 돼요
Dialogue: 0,0:02:01.84,0:02:05.05,Default,,0000,0000,0000,,브라우저는 바디의 글자 크기가\N11픽셀이라는 걸 아니까요
Dialogue: 0,0:02:05.05,0:02:08.06,Default,,0000,0000,0000,,h2는 그것보다\N두 배 커야하니까
Dialogue: 0,0:02:08.06,0:02:12.17,Default,,0000,0000,0000,,h2의 높이는\N22픽셀이 되는거죠
Dialogue: 0,0:02:12.17,0:02:16.58,Default,,0000,0000,0000,,만약 바디 글자 크기를\N12픽셀로 바꾼다면
Dialogue: 0,0:02:16.58,0:02:19.32,Default,,0000,0000,0000,,h2의 크기는\N얼마가 될까요?
Dialogue: 0,0:02:19.32,0:02:21.88,Default,,0000,0000,0000,,맞아요\N24픽셀이죠
Dialogue: 0,0:02:21.88,0:02:26.82,Default,,0000,0000,0000,,만약 h2의 크기를\N1.5em으로 바꾼다면요?
Dialogue: 0,0:02:26.82,0:02:31.14,Default,,0000,0000,0000,,이제 h2의 크기는\N12 곱하기 1.5가 되니까
Dialogue: 0,0:02:31.14,0:02:33.34,Default,,0000,0000,0000,,18픽셀이 되는거죠
Dialogue: 0,0:02:33.34,0:02:37.75,Default,,0000,0000,0000,,바디에 한 것 처럼\Nh2에도 픽셀로 크기를 줄 수 있어요
Dialogue: 0,0:02:37.75,0:02:39.65,Default,,0000,0000,0000,,그럼 같은 방식으로\N적용될 거에요
Dialogue: 0,0:02:39.65,0:02:41.50,Default,,0000,0000,0000,,여러분이 뭐가 더 쉽다고\N생각하는 지에 따라 다를거에요
Dialogue: 0,0:02:41.50,0:02:45.26,Default,,0000,0000,0000,,제가 아까 얘기한 것 처럼\N더 많은 단위들이 있어요
Dialogue: 0,0:02:45.26,0:02:47.25,Default,,0000,0000,0000,,픽셀과 em말고도 말이죠
Dialogue: 0,0:02:47.25,0:02:49.57,Default,,0000,0000,0000,,이 두 개가 가장\N많이 쓰이는 단위에요
Dialogue: 0,0:02:49.57,0:02:51.02,Default,,0000,0000,0000,,그렇지만 다른 단위가\N궁금하다면
Dialogue: 0,0:02:51.02,0:02:53.19,Default,,0000,0000,0000,,'font-size'에 대한\N문서들을 읽어보세요
Dialogue: 0,0:02:53.19,0:02:55.52,Default,,0000,0000,0000,,아니면 인터넷에\N더 많은 강좌를 찾아보세요
Dialogue: 0,0:02:55.52,0:02:58.88,Default,,0000,0000,0000,,여러분의 글자 크기를\N엄청 키워보세요!