Today coding coord </CODi> 열기 분류 전체보기 Javascript jQuery HTML CSS LAYOUT SITE 제작 JS 응용하기 CSS 애니메이션 PRESENTATION 일러스트레이터 NodeJS TIP MySQL 프로그래머스 분류 전체보기 Javascript jQuery HTML CSS LAYOUT SITE 제작 JS 응용하기 CSS 애니메이션 PRESENTATION 일러스트레이터 NodeJS TIP MySQL 프로그래머스 관리 글쓰기 로그인 로그아웃 메뉴
728x90 LAYOUT5 #검색결과 총 5개를 찾았어요 ^^b / 레이아웃 배치 방법 05 : [float,grid,flex] 레이아웃05 이번 레이아웃은 전체 영역이 들어간 구조이며, 실제 사이트에서 이런 구조를 많이 사용하며, 컨테이너를 만들어서 가운데 영역을 설정합니다. float을 이용한 레이아웃 float 속성을 사용해 박스를 왼쪽(left) 또는 오른쪽(right)으로 "부유"시키는 레이아웃 기법 입니다 * { margin: 0; height: 0; } #wrap { width: 100%; margin: 0 auto; background-color: #000; } #header { width: 100%; height: 100px; background-color: #EEEBE9; } #nav { width: 100%; height: 100px; background-color: #B9AAA5; } #main { width.. 2022. 7. 31. 레이아웃 배치 방법 04 : [float,grid,flex] 레이아웃04 이번 레이아웃은 전체 영역이 들어간 구조이며, 실제 사이트에서 이런 구조를 많이 사용하며, 컨테이너를 만들어서 가운데에 요소들이 들어갈 영역을 설정합니다. float을 이용한 레이아웃 float 속성을 사용해 박스를 왼쪽(left) 또는 오른쪽(right)으로 "부유"시키는 레이아웃 기법 입니다, 다만 float를 사용할때는 레이아웃이 깨지는 경우가 생기는데 이럴때는 깨지는 영역에 clear:both를 사용하면 되며, 좀 더 올바른 방법으로는 clearfix를 사용해 해결하는 방법이 주로 사용되곤 합니다. *{ margin: 0; padding: 0; } #header { height: 100px; background-color: #E0F2F1; } #nav { height: 300px; b.. 2022. 7. 29. 레이아웃 배치 방법 03 : [float,grid,flex] 레이아웃03 이번 레이아웃은 전체 영역이 들어간 구조이며, 실제 사이트에서 이런 구조를 많이 사용하며, 컨테이너를 만들어서 가운데 영역을 설정합니다. float을 이용한 레이아웃 float 속성을 사용해 박스를 왼쪽(left) 또는 오른쪽(right)으로 "부유"시키는 레이아웃 기법 입니다, 다만 float를 사용할때는 레이아웃이 깨지는 경우가 생기는데 이럴때는 깨지는 영역에 clear:both를 사용하면 되며, 좀 더 올바른 방법으로는 clearfix를 사용해 해결하는 방법이 주로 사용되곤 합니다. *{ margin: 0; } body{ background-color: #fff3e0; } #wrap { width: 1200px; margin: 0 auto; } #header { width: 100%; .. 2022. 7. 29. 레이아웃 배치 방법 02 : [float,grid,flex] 레이아웃02 이번 레이아웃은 전체 영역이 들어간 구조이며, 실제 사이트에서 이런 구조를 많이 사용하며, 컨테이너를 만들어서 가운데 영역을 설정합니다. float을 이용한 레이아웃 float 속성을 사용해 박스를 왼쪽(left) 또는 오른쪽(right)으로 "부유"시키는 레이아웃 기법 입니다 *{ margin: 0; } #wrap { width: 1200px; margin: 0 auto; } #body{ background-color: #E8F5E9; } #header{ width: 100%; height: 100px; background-color: #C8E6C9; } #nav{ width: 100%; height: 100px; background-color: #A5D6A7; } #aside{ width.. 2022. 7. 29. 이전 1 2 다음 728x90 반응형
최신댓글
총 방문자