[CSS] 20230106 CSS 문법정리, FLOAT 사용법
( 달달구리 조아함)
ㅊ
[오늘의 수확물]
1. 부모태그의 자식태그들은 부모태그의 속성을 상속받는다\
2.스타일 우선순위
브라우저디폴트<외부css문서<style 태그<개별적 style속성
3. 셀렉터에 대하여 (클래스 아이디 다 상관x)
.main{} 이거는 모든 class="main"에 적용됨
body.main{} 이렇게 하면 body의 main에만 한정되서 적용됨
(그니까 원하는 특정부분이 있다면 띄어쓰기없이같이적으면 된다
div#parent{}이렇게 하면 div의 parent만 특정하는 거
4. 그리고 머릿속이 정리가 안되서 어려웠던 건데
id랑 class 지정해주는 기준은 딱 아이디랑 반배정한다고 생각하면 됨
나는 몇반에 다니는 누구다 ! 하는 것처럼
id는 딱 하나만 갖고있는 속성값이고 class는 중복사용이 가능하다
5. 책 읽어보면서 기억해야겠다고생각한거
1)자식셀렉터 div>strong{} div>div>strong{} : 직계 자식한테>를 사용한다
2)자손셀렉터 ul strong{} : 그냥 나열하는 방식
3.전체셀렉터*{} : 웹페이지의 모든 태그에 해당 근데 잘 안쓴다고했던거같음..
4)중복셀렉터 div,strong : ,을 사용한다
float는 인위적으로 왼쪽/오른쪽에다 고정시켜주는거다
그래서 block이 인식을 못하는 듯?(고정값이니까)...
\어려움.......\
처음에 d랑 g에다가 clear:both를 해야겠다~ 고 생각했는데 그럴 필요가 전혀 없었던게
#parent에서 border의 width와 height 값을 300으로 정해줘가지고 알아서 밑으로 내려가버리더라고...
해결해버렸다
근데 나 궁금한게 잘 푼 방법? 그런거는 어떻게 알 수 있을가..?
쌤거랑 비교해보게 찍어옴
셀렉터값이 반영되는 우선순위때문에 저렇게 밖으로 빼신건가..? 하는 의문이 든다. 좀만 달라져도 결과가 달라지니까 이거 뭐가 올바른 판단이되는지를 잘 모르겄네
여기서 border값을 빼서 설정해줬더니 원하는 모양이 나왔음 ... 근데 왜 해결된건지 이해가 되질 않는다....
이제 일주일 됐는데 시간 참 빨리가는 것 같다
그리고 주말이 너무 소중해졌다 주말마다 놀려고 했는데 놀시간이 없네..
공부는 어려우면서 재밌는 것 같다.