CSS

선택자와 선언

어떤 태그를 디자인하기 위해서는 디자인하려는 태그를 

  1. 선택하고 (선택자)
  2. 선택한 대상에게 효과를 줘야 합니다. (선언)

이번 시간에는 CSS에서 가장 기본적인 문법이라고 할 수 있는 이 선택자(selector)와 선언(declaration)에 대해서 알아봅니다. 가장 중요한 내용이라고 할 수 있습니다. 

선택자와 선언

 

예제 - selector_declaration_1.html

<!DOCTYPE html>
<html>
  <head>
    <style>
      li{
        color:red;
        text-decoration:underline;
      }
    </style>
  </head>
  <body>
    <ul>
      <li>HTML</li>
      <li>CSS</li>
      <li>JavaScript</li>
    </ul>
  </body>
</html>

 

댓글

댓글 본문
작성자
비밀번호
  1. 강지후
    <!DOCTYPE html>
    <html>
    <body>
    강의 완료 20170630
    2번째 관문 <strong>CSS</strong>!
    </body>
    </html>
  2. dandan
    효과가 더 따라오면 세미콜론을 찍어준다. 구분하기 위해.....
    가독성을 위해 줄바꿈.


    css selector 구글 이미지 검색

    selector 선택자 (주어)
    declaration 선언 (서술어)

    color - 속성
    red - 속성값
    : 속성과 속성값 구분자
    ; 선언과 선언을 구분하는 구분자
  3. MS lee
    ㅎㅎ
    CODEPEN 저거요, 재미삼아 다른글씨 넣어서 장난쳐보니 참 재미있네요...
  4. 공삼이육
    감사합니다~!
  5. 14번째
    5.6.
  6. php가 첫취업?
    2017-04-30
  7. 광뀨
    0209완료
  8. jgatsby
    잘 배워갑니다.!
  9. matheios
    강의 감사합니다~
  10. 2016.12.25 done!
  11. 임지호
    이고잉님 수업 원래 그래요ㅋㅋㅋ
    제 생각에는 영상 좀 더 깔끔하게 하시려고 중간중간 편집하셔서 그런듯하네요.
    대화보기
    • 임지호
      CSS 기본적인 문법
      - CSS를 적용하고자 하는 태그(선택자)
      - 선택자에 적용할 디자인(선언)
      ex) <style>
      li(선택자) {color:red;}(선언)
      </style>
      *선언하는 내용 끝에 세미콜론 붙이는 것을 습관화하는게 좋다
    • 권행신
      html 수업에서는 안그랬는데, css 동영상 중간중간에 소리가 잠깐씩 mute되는 구간이 있는데 저만 그런가요 .. ?
    • ss
    • 김종엽
      2016.08.24 완료!
    버전 관리
    egoing
    현재 버전
    선택 버전
    graphittie 자세히 보기