본문 바로가기

전체 글62

BNX 홈페이지 구현 - 2 HTML div.prod-list-box.con>ul.row>li.cell*18>(.img-box>img[src="bnx.oa.gg/img/bnx_16fw_visual_$$_list.jpg"])+.prod-name{단가라 ops}+.prod-price{19,000}를 한후 탭하여 18개의 이미지의 밑에 상품명과 가격이 들어가게 만들어 준다 CSS 1. 상품 리스트 박스의 ul>li에 위치를 조정하고 마우스를 올렸을 때 커서가 포인터로 바뀌게 설정해주고 6개의 사진씩 들어가게 바꾸어준다 2. 800px이하의 넓이일때는 5개씩 보이도록, 700px일때는 4개, 600px일때는 3개, 500px일때는 2개, 400px일때는 1개로 설정해준다. 3. 상품리스트 박스의 양옆을 메인사진과 같게 맞추어 준다 4. 상.. 2020. 5. 12.
float 개념 2020. 5. 12.
BNX 홈페이지 구현 - 1 HTML 1. div.logo-bar>a[href="#"].logo>img를 탭한 후 로고 이미지 주소를 넣어준다 2. div.menu-bar.con>nav.menu-box-1>ul.row>li.cell*7>a[href="#"]{메뉴이름}을 한 후 탭을 하여 7개의 메뉴아이템을 만들어준다 3. div.top-bn-box-1.con>div.img-box>img를 탭한후 상단이미지의 주소를 넣어준다 CSS 1. body, ul, li, a 노말라이징 2. 모든 con을 margin-left/right를 auto해주어 가운데 정렬시켜준다 3. cell을 float를 left로 왼쪽으로 정렬시켜주고 box-sizing해준다 4. float을 썼으니까 cell의 부모인 row를 정리해준다 5. img-box>im.. 2020. 5. 12.
개념정리 --------------일러스트 행동 단축키----------------- 파일 열기 : ctrl + O 아트보드 생성 : Ctrl + N 아트보드 수정 : Ctrl+Alt+P 일러스트 설정 : Ctrl+K 오브젝트 복사하기(1) : Ctrl+C,V 오브젝트 복사하기(2) : Alt + 드래그 오브젝트 복사하기(3) : Ctrl+C,F 오브젝트 복사하기(4) : Ctrl+C,B 오브젝트 (최)상단 올리기 : Ctrl+](+Shift) 오브젝트 (최)하단 내리기: Ctrl+[(+Shift) 오브젝트 잠금/해제 : Ctrl +2(+Alt) 아웃라인 보기 : Ctrl+Y 화면 확대 / 축소 : Ctrl++,-/ Z 되돌리기 : Ctrl+Z 앵커포인트 ○ : 정박 ● : 항해 --------------일러스트.. 2020. 5. 12.