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. neal
    2021.09.21 완료
  2. 이현수
    2021.09.02(목)
  3. 유산소
    감사합니다
  4. 두드
    2021.07.21 완료
  5. 감자먹는넘
    감자
  6. jeisyoon
    2021.06.21 선택자 선언 - OK
  7. barozaqu
    20210518.
  8. Jeong Il Haan
    20210511
  9. 무탕
    2021.5.7 완료
  10. 감사히 잘 보았습니다.
  11. gkalsdlf
    ㅇㄹ!
  12. Minint
    2021.02.26
  13. HyeonHui Jeong
    20210215
  14. 스마일가이
    2021.01.26 완료 감사합니다
  15. datsciseol
    20210115
  16. 따뜻한츄르
    201229
  17. 201223 ✅
  18. 2NG(이엔지)
    <body>
    <h1 >hello world</h1>

    h1 여는태그 부분의 >가 한 칸 떨어져 있네요.
    대화보기
    • 201213
    • 몽실엄마
      오늘도 하나 배워갑니다.
    • switpotato
      20201122: 2차학습 완료
    • 켄드릭
      2020년 10월 29일(목) 13:49 1차 학습완료
    • jaehyunlee
      완료
    • 오석민
      완료
    • 박병진
      20200930완료
    • 콜라
      20200926완료
    • 여니여니
      200920 감사합니다
    • 김성곤
      20200716 감사합니다!
    • leechi
      간단히 선택하고 선언하면 기본적인 css 완성
    • 열심히사는사람
      완료
    • 한강
      선택자는 주어 선언은 서술어~~!!! 감사합니다.
      200526
    • 노래하는프로그래머
      완료!
    • adhoc
      <!DOCTYPE html>
      <html>
      <head>
      <style>
      h1{color:blue}
      </style>
      </head>

      <body>
      <h1 >hello world</h1>

      </body>
      </html>

      여기서 <h1>태그에 css 로 색깔을 파란색으로 바꿨는데 적용이 안되는데 이유가 뭔가요?
      hl 과 h1을 인식못해서 그런건가요? h2부턴 적용이잘되고 <body> 태그 밑에 <h1> 태그 안의 속성에서 색깔을 바꿔주면 잘적용되는데 <head>태그의 <style>에서 <h1>태그에 css 로 색깔을바꾸는것만 적용이 안되요 ㅠㅠ
    • <style>
      css언어
      </style>

      선택자 { 선언문 }
      { 선언문 } = { 속성:속성값; }
    • 무지개반사
      완료
    • opper
      2020. 1. 6 수업완료
    • Blanc
      2020.01.04
    • 유새봄
      2년전 댓글이지만 제가 찾아낸게 신기해서 답글을 달아야겠어요 :)
      <body>
      </body>------> 이걸 빼야해요!
      <ul>
      <li>HTML</li>
      <li>CSS</li>
      <li>JavaScript</li>
      </ul>
      </bdoy>----> </body>
      대화보기
      • Grigo
        완료
      • 치디우기
        2019/8/25 수강완료
      • 다나가
        190718 - 완료!!
      • 김주엽
        수업완료
      • 잘될자
        190502 수강완료
      • 홍명교
        2019.04.16. 수강완료
      • 김예은
        190402 수강완료 감사합니다
      • lygon
        2019-02-22 완료
      • 한승민
        190212
      • steal
        20190124 완료
      • 숨이
        완료했습니당
      • 김민영
        완료
      버전 관리
      egoing
      현재 버전
      선택 버전
      graphittie 자세히 보기