728x90
반응형

header 3

비주얼 스튜디오 코드 기초② 웹페이지 레이아웃 만들기

concept(overview, color(주조색,보조색,강조색)) > logotype(텍스트, 아이콘), 로고설명, 로고 치수 > main font(영문,한글) 두께 > wire frame(골조), 레이아웃 TOOL: 피그마/포토샵/일러스트레이션 Reference > 회사의 웹페이지를 벤치마킹 웹페이지 주제정하기: 반응형X , 팀프로젝트(개발), 반응형 헤더(Header) 배너(Banner) 컨텐츠(Contents) 푸터(Footer) 비주얼 스튜디오 코드 _확장프로그램 Live Server 설치 extensions > live server 설치 live server : 미리보기 프로그램 하단에 Go Live라고 뜨면 실행가능한 상태이다. html 5 css: css3버전, 바디의 속성을 바꿔줌 *포토..

웹 디자인 header.html

포토샵 새로만들기 > 문서설정 w1200 * h700 rgb컬러 설정 [레이어추가] -header -banner -contents -footer style > fixed size 변경 후 height 100 / 300 / 200 눈금자 표시 style > normal 변경 포토샵 보다 피그마가 더 유용하게 사용함 영역 지정후 레이어 별 alt+delet 연한색으로 칠하기 비주얼스튜디오에서 넘어와서 포토샵에서 디자인한 정보를 토대로 스타일을 변경해줌 div 기본적으로 마진값이 적용되어있다. div 마진값 설정 마진값 0을 주고싶다면 margin: 0px; * : 모든영역에 적용 > 모든 영역에 디폴트로 적용 padding: 글자에 여백이 들어감 여백 치수는 시계방향으로 적용된다. 모든 모니터에 적용하기 위..

비주얼스튜디오코드 기초 ①

[텍스트 관련 요소 태그] [글자크기 변경] 확대 ctrl+ + 축소 ctrl+ - [새로만들기] 파일 > 폴더열기 > 오른쪽마우스 > NEW FILE > index.html 작성 > 오른쪽창에 ! 엔터 html lang- " en" > english viewport : display > 1:1 로 들어가겠다 안들어가면 반응형이 안됨 코딩: ~ div : 블럭 사각형이라고 생각하기 인라인 구조 : 텍스트구조 div 구조: 사각형구조 body 안에 div를 넣어줘야함 4개의 div 가 필요함 : 헤더 / 베너 / 컨텐츠 / 푸터 내부스타일 div 이름정해주기 > 선택자 아이디로 설정 html > id id = " 000 " > 000 더블클릭에서 복사 붙여넣기 div > # header / w , h , ..

728x90
반응형