테스트 사이트 - 개발 중인 베타 버전입니다

css 머리가 터져버릴거 같습니다 ㅠㅠ 채택완료

4년 전 조회 2,068

드랍다운 메뉴를 만드는중에

 

  • 메뉴1

     

    이렇게 하고 css 에서 

     

    ul > li {font-size:20px;}

     

    이렇게 하면 대메뉴의 메뉴1,메뉴2,메뉴3만 폰트가 20이 되야 하는거 아닌가요??

    그 하위 li 까지 같이 효과를 먹는데 이해가 안갑니다 ㅠㅠ

    유튜브나 책을 다시 봐도 ul > li  이렇게 선택하면 자식요소만 변경 된다고 하는데

    그 아래까지 변해버리니.... 왜그런지 

댓글을 작성하려면 로그인이 필요합니다.

답변 2개

채택된 답변
+20 포인트

     

  •     메뉴1

       

     

    위에 마크업에 아무런 class 도 id도 없다면 위에 표시한 부분은 같은 조건이기때문에 당연히 말씀하신대로 css가 동일시하게 적용됩니다 

     

    ==== 수정 =======

       

    •     메뉴1

         

       

      ul.depth1 > li{ font-size:20px} 

      이렇게 되어야 첫번째 ul의 하위 직계 자식인 li에게만 css가 적용됩니다 

      추가적으로 공통적으로 쓰는 요소에게는 id보다 class를 활용하시는것이 좋습니다

       

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

https://flukeout.github.io/  이것을 한번 풀어 보시죠

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인

전체 질문 목록

🐛 버그신고