WEB2 - CSS

CSS 선택자를 스스로 알아내는 방법

강의 

내용이 많고 복잡합니다. 시간을 충분히 확보하고 시작하세요.

 

 

 

소스코드

변경사항

댓글

댓글 본문
작성자
비밀번호
  1. 아마도 태그 순서 때문일겁니다.
    <h1> <a href="~~"> CSS </a> </h1>
    과 같이 h1이 더 바깥에 싸고 있고, a 태그가 안쪽에서 싸고 있기 때문에 a태그가 더 구체적인 것이 되어서요.
    대화보기
    • lygon
      2019-02-16 완료
    • 호두
      감사합니다.
    • 주하쿠
      감사합니다
    • 완료:o
    • sunmoon228
      완료 ^-^
    • boriku
      완료:)
    • dudwn7504
      Id는 한 웹페이지에서 단 한번밖에 못쓴다
      라고 이해하면 되나요?
    • 지미츄
      완료 감사합니다!
    • 완료
    • 김수빈
      완료
    • 김수빈
      완료
    • Aimhee
      완료
    • 삼색냥
      완료
    • 감사합니다^^
    • whynitz
      저도 의문입니다. 강의 영상에서 saw 클래스를 이용해 "HTML"과 "CSS" 색을 바꾸는 건 근본적으로 들어가본 링크의 색을 바꾸는 게 아니지 않나요? ㅠㅠ 밑에 댓글중에 a:visited 를 이용하면 된다길래 시도해 봤는데 저는 들어가본 링크 색이 회색으로 바뀌지 않았습니다..
    • 한강
      감사합니다.
      다들 좋은 밤 되세요~~^^!
    • 김정훈
      완료
    • 한번 더 들으니 다행히도 금세 이해가 갔습니다.

      선택자 중에서는 id>class>tag 순으로 우선순위를 갖고
      같은 선택자 중에서는 최근(아래쪽)에 입력된 순서로 우선순위를 갖는다.
    • 이때까지 문제 없이 잘 따라왔는데 약간 어렵다고 느꼈어요!
      감사합니다.
    • HongKyu Lim
      감사합니다:)
    • 예아쓰
      12/05 다시보기
    • 눈누난나
      style안에 saw앞 클래스라는걸 의미하는 .이 없습니다

      .saw {color:pink;}

      ========================

      본 페이지 안본페이지 구분을 물어보는게 제가 정확히 모르겠지만,
      다 분홍색으로 나오는 이유는 li태그안의 a태그에 클래스 saw를 다 적용했기 때문에 핑크로 보여집니다.
      안본페이지의 색상을 원하시면 클래스 saw를 제거해주세요
      대화보기
      • 눈누난나
        밑에 적용된 것이 우선순위 되는게 맞습니다
        대화보기
        • 눈누난나
          p태그안에 a태그가 자식태그로 속해있으므로 a태그의 스타일인 칼라값이 적용됨
          대화보기
          • Min Sang Shin
            완료
          • 돼지천재
            감사합니다.
          • 김리니어
            saw 와 active가 특정한 기능을 실제로 갖고 있는 것처럼 착각한 초보 1입니다 ㅎㅎ 어리둥절하다가 댓글을 보고 이해했네요 ;- ; ㅎㅎ 감사합니당
            대화보기
            • 감사합니다.
            • 키보드치는남자
              잘들었습니다
            • 이상태
              아무래도 saw클래스와 active id에서 saw와 active가 어떤 특정한 기능을 실제로 갖고 있는 것 처럼 착각할 여지가 있는 것 같습니다(초보자 입장에서는)

              보여주신 건 2.html 페이지에서 1.HTML이라는 텍스트를 회색으로 입히고, 2.CSS라는 텍스트를 빨간색으로 입히는 작업을 클래스와 id를 이용해서 하신 것이지요??

              이렇게 할 경우 매 페이지마다 현재 보고있는 페이지를 빨간색으로 코딩해줘야하는 번거로움과 동시에, 실제로 클릭하지 않았는데도 앞의 번호들의 클릭한것처럼 회색으로 변해있을 것 같아요. 실제로 방문했거나, 방문중인 걸 자동으로 인식하도록 코딩하는 방법은 없을까요? 아마 뒷강의를 들으면 나올 것 같긴 한데.. 궁금해서 여쭙니다!!

              아 그리고 이렇게 어려운 개념을 쉽게 설명해주셔서 감사합니다!!
            • 광장공
              a {
              color:black;
              text-decoration: none;
              }
              p {color:blue;}
              span {color:black;}

              스타일 적용하려는데 하나 걸리는게 있는데요 ㅠㅠ 제가 P로 묶인 부분을 파란색으로 표시하려고 하는데
              그 P 단락에도 a태그로 된 링크가 하나 있거든요??

              그런데 a태그나 p태그나 똑같이 태그선택자가 아닌가요??? 그렇다면 더 밑에 있는 P선택자로 인해서 그 안의 부분은

              다 파란색이 될 줄 알았는데 P단락 안의 링크는 계속 검은색으로 고정되네요.... ㅠㅠ
            • 타나
              감사합니다.
            • Yeonhwa An
              감사합니다
            • icdoit
              감사합니다.
            • 웅이
              감사합니다:)
              대화보기
              • 이창연
                임의로 사용한것입니다.
                saw라고 한 이유는 한번 보고 지나간 페이지라는 의미에서 하신거 같고
                active는 지금 보고있는 페이지 이기때문이라고 설명해주시는거 같네요.
                대화보기
                • 웅이
                  강의에서 class값으로 사용한 saw 와 id값 active는 그냥 임의로 사용하신건가요, 아니면 특정 명령을 위한 값인가요?
                • 완료
                • 진영
                  완료
                • <head>
                  <title>WEB - CSS</title>
                  <meta charset="utf-8">
                  <style>


                  a {
                  color: black;
                  }

                  #active {
                  color: red
                  }

                  .saw {
                  color: gray;
                  }

                  h1 {
                  font-size: 21px;
                  text-align: center;
                  /*아마 a라는 지시자와 중복이 되면서 안먹히는 듯 함*/
                  color: red;
                  }
                  </style>
                  </head>

                  이렇게 하는 경우 h1은 red로 했는데 왜 a 선택자를 우선으로 해서 색이 검정색으로 나올까요?
                • 한라봉
                  완료
                • 필립
                  완료
                • 임재현천재
                  완료!감사합니다!
                • 조예진
                  class="saw"이런식으로 만들면 실제로 본 페이지를 인식해서 자동으로 색을 바꿔주는게 아니라 저희가 직접 본 페이지를 지정해주는거 아닌가요?
                • Lee Sangjun
                  아으 어렵다. ㅋㅋ
                • 시간속으로
                  완료
                • aimerthis(이성민)
                  감사합니다
                • 감사합니다.
                • 과천영일
                  조금 어려웠어요. 하지만 다음것을 하다보면 이해가 되겠지요? 이번편도 감사합니다.
                버전 관리
                egoing
                현재 버전
                선택 버전
                graphittie 자세히 보기