[개발일지 46일차] toco 프로젝트 1 - 클론 코딩(5)

OOMJ·2022년 7월 8일

projsect 개발일지

PROJECT

목록 보기

5/34

2022-07-08

어제 정리한 금주 작업분

1) 글꼴 포함 디테일함을 올려주는 세부 조정은 계속 진행하는 중
ex) 글자/이미지/카드 등의 배치/위치/간격 조정...
2) 가이드 라인 만들기

1) 세부 조정

각자 파일을 건드리는 중이라 다음 주중까지.
뭘 수정하면 좋을까

noto sans 글꼴 적용
970px쯤 헤더 이미지와 텍스트가 겹치는 부분 수정
미디어쿼리 - 화면을 줄일 때 리소프트 로고 타이틀 배경이 너무 넓은 부분 수정
미디어쿼리 - 고객사들 텍스트 떨어지는 것 단어에 맞게 떨어질 수 있도록
미디어쿼리 - TEL / FAX / E-MAIL / ADDRESS 부분 간격 조정
미디어쿼리 - Map과 컨텐츠들의 사이 간격 조정....

2) 가이드 라인 만들기

다음에 작업해야 할 것을 구체적으로 정해놓지 않아서 자세히 짜진 못했지만 가이드 라인 초안은 작성 해놓았다

//가이드라인 - 글꼴/ 클래스명 지정/ 색 지정(타이틀 어느부분 컬러)/ 배치(사이즈)와 관련된 것(마진, 패딩 공통적으로 가져가는거)

(1) 파일명 index.html / style.css / script.js / toco_img(이미지폴더) 통일

(2) 이미지, 작업에 쓰일 리소스들의 이름은 모두 영문을 쓴다. 띄어쓰기가 필요한 경우 언더바를 쓴다.

(3) 클래스명 top-    /   center-   /   bottom-  : 보류
    아이디명 : 보류
    
(4) 글꼴, 색 지정(타이틀 어느 부분은 어떤 컬러) : 작업 내용이 정해지면 그때 재논의

(5) 배치 사이즈는 reset css라는 만들어진 오픈 소스를 쓴다.
    
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}