1 00:00:00,342 --> 00:00:03,899 자, 우리의 '도넛과 그것을 먹는 위험함' 웹페이지로 돌아 왔네요. 2 00:00:03,899 --> 00:00:08,150 와 태그에 넣은 warning (경고) class가 정말 마음에 들군요. 3 00:00:08,150 --> 00:00:12,673 하지만 저는 이 warning (경고) fact가 좀 더 눈에 띄게 만들고 싶어요. 4 00:00:12,673 --> 00:00:16,889 이제 class 줄의 'fact'에 회색 경계가 생겼네요. 5 00:00:16,889 --> 00:00:20,922 하지만 더 크고 두꺼운 주황색 경계선이 생기면 더 좋을 것 같아요. 6 00:00:20,922 --> 00:00:25,802 그럼 이제 그 경계를 'warning' 줄에 넣어 봅시다. 7 00:00:25,802 --> 00:00:29,581 따라서 border: 5px solid orange (경계선, 5px, 두꺼운, 주황색) 이라고 쓰면 되겠네요. 8 00:00:29,675 --> 00:00:34,198 아, 맘에 들군요. 하지만 태그에도 이게 있네요. 9 00:00:34,219 --> 00:00:37,319 저기에 저 글과 선이 있으니 보기가 좋지 않군요. 10 00:00:37,319 --> 00:00:39,982 저는 주황색 경계가 warning (경고)박스에만 있으면 좋겠어요. 11 00:00:39,982 --> 00:00:43,744 저렇게 선 안에 있는 경고 글에 말고요. 12 00:00:43,744 --> 00:00:46,511 어떻게 좀 더 명확한 수업규칙을 만들 수 있을까요? 13 00:00:46,511 --> 00:00:50,532 음, 하나의 방법은 경고 박스를 나타낼 아에 하나의 새로운class를 만드는 겁니다. 14 00:00:50,532 --> 00:00:55,152 그리고 경계선 특징들을 거기로 옮기는 것이죠. 하지만 우리는 그렇게 할 필요가 없어요. 15 00:00:55,152 --> 00:01:01,220 대신에, 브라우저가 경계선 특징들을 오직 경고 박스 태그에만 적용하도록 시키면 되요. 16 00:01:01,220 --> 00:01:04,576 다른 태그들은 제외하고요. 17 00:01:04,576 --> 00:01:09,121 그렇게 하기 위해서는, 우리는 우리가 찾고 있는 element (요소), 'p'를 먼저 적습니다. 18 00:01:09,121 --> 00:01:14,170 그리고 나서 점을 찍어요. 그리고 class 이름인 'warning'을 적습니다. 19 00:01:14,170 --> 00:01:18,673 이건 이제 브라우저에게 모든 class가 'warning' 인 를 찾도록 해서 20 00:01:18,673 --> 00:01:21,385 아까의 그 특징들을 적용하도록 합니다. 21 00:01:21,385 --> 00:01:26,453 자, 그럼 아까 그 경계특징을 여기로 복사해 봅시다. 22 00:01:26,453 --> 00:01:34,321 그리고 짠! 말고 fact에만 그 경계를 적용시켰네요! 23 00:01:34,321 --> 00:01:37,595 우리는 element와 class의 어떤 조합으로도 브라우저가 class를 가지고 있는 특정한 태그에만 24 00:01:37,595 --> 00:01:42,603 스타일을 적용시키도록 할 때 언제든지 똑같이 할 수 있습니다. 25 00:01:42,603 --> 00:01:45,233 이 순서를 그대로 따라할 것을 명심해 주세요. 26 00:01:45,233 --> 00:01:50,707 (태그 이름), (점), 그리고 (class이름) 27 00:01:50,707 --> 00:01:56,453 만약 실수로 태그이름과 점사이에 스페이스(공간)를 넣게 되면, 제대로 작동 되지 않을 겁니다. 28 00:01:56,453 --> 00:01:59,940 왜냐하면 스페이스는 CSS에서 다른 것을 의미하기 때문입니다. 29 00:01:59,940 --> 00:02:02,795 그리고 브라우저는 그 것을 다르게 해석하기 때문입니다. 30 99:59:59,999 --> 99:59:59,999 그 의미있는 특별한 스페이스를 찾아 낼 수 있도록 주의하세요! :)