Return to Video

더 많은 CSS 속성들

  • 0:01 - 0:04
    들어봐요
    CSS 속성은 끝이 없어요
  • 0:04 - 0:06
    몇 가지 더 보여줄게요
  • 0:06 - 0:12
    만약 제가 이 가사의 줄 간격을
    바꾸고 싶다면 어떻게 할까요?
  • 0:12 - 0:16
    저는 'line-height' 속성을
    사용할 수 있어요
  • 0:16 - 0:19
    그리고 15px 같은 값으로
    설정하는 거죠
  • 0:19 - 0:25
    아니면 1.5em으로 하는게
    나을 수도 있겠네요
  • 0:25 - 0:28
    글자 크기의 150퍼센트로
    줄간격을 설정하게 되니까요
  • 0:28 - 0:32
    만약 가사를 가운데 정렬로
    만들고 싶다면 어떻게 하면 될까요?
  • 0:32 - 0:36
    'text-align'속성을 쓸 수 있어요
    'center'로 값을 설정하는 거죠
  • 0:37 - 0:39
    아니면 'right'나 'justified'로
    설정해 둘 수도 있어요
  • 0:39 - 0:42
    보기에는 좀 이상하다고
    생각이 들겠지만요
  • 0:42 - 0:45
    만약 본문에다
    밑줄을 치고 싶다면요?
  • 0:46 - 0:49
    'text-decoration'속성을
    이용하면 될거에요
  • 0:49 - 0:52
    값은 'underline'으로
    설정하고요
  • 0:53 - 0:57
    만약 링크로부터
    밑줄을 지우고 싶다면요?
  • 0:57 - 0:58
    위키피디아에 대한
    이 링크같은 것들요
  • 0:59 - 1:01
    브라우저는 기본 스타일을
    지정해두고 있어요
  • 1:01 - 1:03
    모든 것에 적용되는
    스타일 말이죠
  • 1:03 - 1:05
    여기서는 링크에 대한
    'text-decoration: underline'이겠죠
  • 1:05 - 1:09
    하지만 CSS를 사용하면 브라우저의
    기본 스타일을 다시 지정할 수있어요
  • 1:09 - 1:11
    'text-decoration: none'
    이라고 해주면 돼요
  • 1:12 - 1:19
    여기다가 이 규칙을 추가할게요
    a { text-decoration: none; }
  • 1:20 - 1:23
    이제 더이상 밑줄이 없는 걸
    볼 수 있죠
  • 1:23 - 1:25
    하지만 이걸 할 때는
    주의해야할 점이 있어요
  • 1:25 - 1:28
    왜냐하면 기본 설정에는
    보통 어떤 이유가 있기 마련이죠
  • 1:28 - 1:31
    만약 링크에 밑줄이 없다면
    사람들이 그게 링크라는 것을 어떻게 알까요?
  • 1:31 - 1:35
    만약 그게 보통 텍스트라고 생각해서
    절대 누르지 않게 된다면요?
  • 1:35 - 1:39
    우리가 그 밑줄을 지울 때는
  • 1:39 - 1:42
    그 링크가 다른 방식으로라도
    다르게 보이게 만들어야 해요
  • 1:42 - 1:44
    그렇지 않다면
    사용자들이 슬퍼할 거에요
  • 1:44 - 1:46
    그리고 사용자들이 슬퍼하면
    저도 슬퍼지니까요
  • 1:46 - 1:48
    그렇게 되면 여러분도
    슬퍼질 거에요
  • 1:49 - 1:52
    저는 여러분에게 하루종일
    문자 속성에 대해 얘기할 수 있어요
  • 1:52 - 1:54
    하지만 그러지 않을 거에요
    아직 해야할 게 너무 많으니까요
  • 1:54 - 1:56
    수 백개의 CSS속성이 있어요
  • 1:56 - 1:58
    그리고 브라우저는 매년
    새로운 것을 추가하고 있죠
  • 1:58 - 2:01
    그 모든 것들에 대해
    여러분에게 말해주지는 않을 거에요
  • 2:01 - 2:03
    하지만 여러분이 재미있어할만큼은
    얘기해 줄 수 있었으면 좋겠어요
  • 2:03 - 2:06
    만약 여러분이 어떤 스타일에 대한
    CSS 속성이 있는지 궁금한데
  • 2:06 - 2:08
    여기 우리 문서에 없다면
  • 2:08 - 2:11
    검색 엔진을 통해 찾아보세요
  • 2:11 - 2:15
    예를 들어 문자에 그림자를
    추가하는 방법을 알고 싶다면
  • 2:15 - 2:18
    인터넷에 "CSS 텍스트 그림자"
    라고 검색해 보세요
  • 2:18 - 2:19
    그러면 아주 많은 결과물을
    볼 수 있을 거에요
  • 2:20 - 2:22
    보통 인터넷을 통해
    검색을 해서
  • 2:22 - 2:23
    여러분의 질문에 대한
    답을 찾을 수있다는 것은
  • 2:23 - 2:25
    웹 개발자에게는
    아주 중요한 기술이에요
  • 2:25 - 2:28
    왜냐하면 여러분과 같은 질문을
    했던 사람들이 아주 많고
  • 2:28 - 2:32
    99.9퍼센트로
    답은 그 곳에 있을 거에요
  • 2:32 - 2:35
    여러분은 그 답을
    잘 찾기만 하면 돼요
Title:
더 많은 CSS 속성들
Description:

more » « less
Video Language:
English
Duration:
02:35

Korean subtitles

Incomplete

Revisions