display:flex2 0227_html5/css3_display:flex -(1)기본정렬 space-between display: flex 유연한 박스를 만들 수 있음 - ie11부터 지원함으로 웹에서는 아직까지는 사용하기 어려움 - 모바일은 괜찮음 알아서 가로로 배치해줌. -비고) float를 이용해서 작업하려면, float해지하는 작업도 해야함 -웹상에서 flex로 작업한 것은 찾기 힘듦.(외국 사이트에서는 크롬 위주로 개발해서 찾기 쉬움) -모바일 용으로는 사용하기 유용 dispaly:flex; justify-cont: ; - 선택한 속성 대로 자동으로 정렬 함 justify-content: center - items를 가운데로 배치 .container{width: 700px; height: 100px; border: 2px solid #07c; display: flex; justify-content: cent.. 2020. 3. 4. 0227_html5/css3_선택자:nth-of-typenth-of-type()/ nth-child() /not() 코드보기 [더보기] 선택 더보기 [ last-child ] 마지막 자식요소를 선택하는 선택자 첫번째 자식요소 두번째 자식요소 세번째 자식요소 [ nth-of-type()/ nth-child() ] 몇번째 자식을 선택할 것인지 1) nth-of-type() : 해당하는 요소들 중 몇 번째 요소 2)nth-child():전체에서 몇번째 요소 1. 첫번째 p요소 -----------> 1 1.첫번째 strong요소 -----------> 2 2. 두번째 p요소 -----------> 3 2.두번째 strong요소 -----------> 4 3. 세번째 p요소 -----------> 5 3.세번째 strong요소 -----------> 6 [ not() ] :not() ()을 제외하고,~~ 지정/스크립트에서도 씀 2020. 3. 4. 이전 1 다음
