web (71) 썸네일형 리스트형 0512 / Ps을 이용한 layer 가이드 - 작성요소 설명 **시멘틱 구조의 가장 대표적인 case** **header** (headBox) - 웹페이지에서 **회사의 정확한 인식이 가능한 정보(로고)** 전체 페이지의 대부분을 이동, 각페이지에서도 형태가 거의 변하지 않는 navigation 영역이 존재 **aside** (sideBox) - 내용이 있으면, 좋은정보이지만 없다고해서 큰 문제가 되지 않는 영역 **section** (viewBox) - 다른영역과 연계가 되어있긴 하지만, 상세정보를 나타나기보다는 기획/이벤트성의 자료를 담는 곳 **article** (contentBox) - 내용의 상세정보를 담기도하고, 별도의 작은 웹형식으로 구성이 가능한 곳 **footer** (footBox) - 주로 하단에 존재하지만, 회사의 주요정보를.. 0511 / layout.css - float와 clear 속성값 @charset "UTF-8"; /* css/src/layout_001.css */ /* reset.css */ html, body { margin:0; } /* layout_design.css */ #wrap { width:600px; height:auto; margin:auto; } /* #header ==================== */ #header { width:100%; height:100px; background-color: #f07; } /* #section ==================== */ #section { /* overflow:auto; */ width:100%; height:auto; background-color: #fa0; } .sect_01 { float:left.. 0510 / Ps - 포스터 만들기 0510 / layout.css 작성 @charset "UTF-8"; /* css/src/layout_001.css */ /* reset.css */ html, body { margin:0; } /* layout_design.css */ #wrap { width:600px; height:auto; margin:auto; } /* #header ==================== */ #header { width:100%; height:100px; background-color: #f07; } /* #section ==================== */ #section { width:100%; height:auto; background-color: #fa0; } .sect_01 { float:left; width:40%; height:3.. 0510 / layout.html 작성 DOCTYPE html> 웹 기초 - 레이아웃 연습_001 #header .sect_01 .sect_02 #footer --------------------------------------------------------------------------------------------------------------------------- (html 모드로 변경) #header sect_01 sect_02 #footer 0506 / photoshop 도장 및 힐링브러시 #1 Ps - 도장 및 힐링브러시를 사용한 이미지 편집 1) Ps - 도장 및 힐링 브러시를 이용한 이미지 편집 (물건 지우기) 2) Ps - 도장 및 힐링 브러시를 이용한 이미지 편집 (텍스트 지우기) 3) Ps - 도장 및 힐링 브러시를 이용한 이미지 편집 (주사위 안 숫자 지우기) 0506 / setting_test.js // setting_test.js console.log( 'setting_test 파일 연결 완료! '); 0506 / setting_test.css & basic_code_05_reset.css @charset "UTF-8"; /* setting_test.css */ html, body { width:100%; height:100%; background-color: #acf; } ----------------------------------------------------------------------------------------------------------------------------------- @charset "UTF-8"; /* basic_code_05_reset.css */ /* reset.css */ html, body { width:100%; height:100%; margin:0; } h1,h2,h3,h4,h5,h6 { margin:0; } /* test -------.. 이전 1 ··· 5 6 7 8 9 다음
