질문드립니다!
152
작성한 질문수 2
안녕하세요 강의를 보던 중 문의드립니다!
위의 이미지 부분에서 .box div 선택시, box 자손 div들은 모두 같은 css가 적용된다고 하셨는데 오른쪽에 보이는 박스들은 왜 같은 위치가 아니고 자식div만 padding값이 적용된건가요?..
그리고 혹시 이렇게 태그방식 말고 각 태그에 class를 지정해서 스타일 지정해주는 방식으로 진행하면 안되는건가요~?!
class로 지정할 시, css에서 해당되는 것을 호출(?) 하는 것도 궁금합니다..!
만약
<div class="parent">
<div class="a">
<div class="b"></div>
</div>
</div>
이런식으로 자손요소에 class명(b)을 지정해서 스타일을 매기고 싶다면
.b만 쓰면 되는건지, 그 앞에 부모요소(.a .b)라고 써야되는건지 부모의 부모요소까지 써야되는건지(.parent .a .b)궁금합니다!
답변 1
2
<div class="box">
<div>
<div></div>
</div>
</div>
.box div 에 패딩을 주시면 .box div 뿐만 아니라 .box div div 도 패딩이 들어갑니다. 스페이스는 자손 선택자이기 때문에 마지막의 div도 적용됩니다.
물론 마지막 div에 클래스네임을 주어서 예를들어 .last 라는 클래스네임을 주었으면 .last에 따로 패딩을 조절하시면 됩니다.
하지만 이렇게 하는 것 보다는 2번째 div에만 패딩을 주고 싶으면 선택자를 .box > div 라고 자식선택자(>) 사용하시는게 좋습니다.
좋은 CSS는 클래스네임 사용을 최소화하면서 html 엘리먼트를 선택하는 것 입니다.
class 값 한 번에 부여하는법
2
80
1
@media에서의 flex-direction: column으로 세로배치 관련 질문드립니다.
1
69
1
div#css-checker-widget의 해결방
1
60
2
input의 포커스되었을때 검정선이 사라지지 않아요
0
79
2
강의듣는법
1
73
1
아코디언 만들기 100%이하의 화면으로 보았을때
1
68
2
input checked 질문합니다.
0
76
1
Bracket Pair Colorizer - 비주얼 스튜디오
1
140
2
Part 1 영상 안나옵니다
1
88
1
제이쿼리 작동이 안됩니다
1
199
3
강의 내용 질문있습니다.
1
120
2
일정 부분만 주석하는 방법
1
211
2
폰트어썸
1
134
2
인접선택자에 대한 질문드립니다!
1
129
2
delay 적용 안됨
1
134
1
rotateY(360deg)가 적용이 안됩니다!
1
186
2
세로이동할때 height값
1
138
2
폰트어썸이 안되요..
1
485
2
화면 정중앙에 오게끔 할수있나요?
1
169
1
어코디언 네비게이션 중
1
124
1
라이브서버 문제
1
225
2
넷플릭스 어코디언 예제 질문
1
102
1
이번 강의에선 display flex가 무조건 적으로 필요한건가요 ?
1
154
1
active 관련 질문
1
145
2