IT/html+css4 구조 나누기 body { margin: 50px; font-family: monospace; } header { background-color: #D09E88; text-align: center; padding: 20px; } nav { background-color: #9B8281; text-align: right; list-style-type: none; } nav>ul { display: inline-block; list-style-type: none; } nav>ul>li>a{ text-decoration: none; } nav>ul>li { float: right; padding-right: 20px; } article { float: left; height: 300px; background-color: #.. 2019. 5. 7. 꿈들이 만들기 1. 일반 구조 선택자 - 특정한 위치에 있는 태그를 선택하는 선택자 형식) :nth-child(수열) : 형제 관계 중에서 앞에서 수열번째 태그를 선택 예) : nth-child(2n) 인 경우 : 2,4,6,.. 번째 위치하는 태그를 선택 nth-child(2n+1) 인 경우 : 1,3,5,.. 번째 위치하는 태그를 선택 :nth-child(숫자)인 경우 : 숫자 번째 위치하는 태그를 선택(양수) 2. 그 외 일반 구조 선택자 :first-child : 형제 관계 중에서 첫 번째 위치하는 태그를 선택 :last-child: 형제 관계 중에서 마지막에 위치하는 태그를 선택 :nth-last-child 수열 : 형제 관개 중에서 위에서 수열 번재에 위치하는 태그를 선택 2019. 5. 7. display vs float css를 사용하다보면 정렬을 할 때 무엇을 써야할지 고민을 할 때가 있다. display의 경우 하단에 맞춰들어가고 이미 기본 css가 정의되어 있기 때문에 float를 더 권장한다. float의 경우 사용이 끝나면 clear:both혹은 clear : right 혹은 clear:left를 해줘야 한다. display는 기본적으로 공간이 생성된다. style에 기본적으로 마진값이 들어 있기 때문에 이를 없애고 싶으면 margin 값을 음수로 줘야 한다. 이게 싫다면 float를 줘야 한다. 또 다른 차이를 볼 수 있는 방법은 overflow가 발생했을 때다. float의 경우는 그냥 다닥다닥 마진 없이 붙는다 이 둘의 차이는 이쯤에서 끝내기로 하고 overflow로 넘어가겠다. overflow 발생 시 .. 2019. 5. 7. HTML & CSS 마크업 언어란 문서의 중간에 문자나 문장 형태의 명령어를 삽입하는 방식의 문서 표현 언어로 Tag 형태를 사용한다. HTML은 주로 W3School을 참고할 거고 현재 받고 있는 교육과정의 내용도 첨부할 것이다. ++https://www.w3schools.com HTML(HyperText Markup Language) & CSS(Cascading Style Sheet) 설명보다는 유용하게 쓸 태그나 기능들을 기록할 예정이다. 2019. 5. 7. 이전 1 다음