- "디자인 가이드"
- google material system
*Uncaught Synctaxerror : 자바스크립트 에러
- 단위
- px, %, vw(화면너비), vh(화면높이)
- em ; 글자크기, 1em=글자 하나크기, 지정된 font-size에 따라 크기가 변한다!
- rem ; html에 정의된 글자사이즈, 반응형
if >> body에 지정된 font-size가 16
* 게슈탈트 이론 (심리학) 기반의 디자인
- SASS 활용하기
- 중복 제거!
- 동위폴더에 SASS폴더 만들고 example.sass 파일 만들기
- 확장 프로그램 Live Sass Compiler 설치
- .sass 파일 작성상태에서 하단 Watch Sass 클릭후,
Watching 상태에서 저장하면 설정한대로 지정경로에 css 파일생성(success)
- 설정 >> Live Sass Compile Config
1. setting: Formats
- compact : 한줄씩
- compressed : 모두 이어서
ex)
{
"format": "compact",
"extensionName": ".css",
"savePath": "~/../css"
},
{
"format": "compressed",
"extensionName": ".min.css",
"savePath": "~/../css"
}
2. setting: Generate Map
- true(default) ; 맵 파일 자동생성 O / false ; 맵 파일 자동생성 X
- 위계구조에 맞게 { }로 들여쓰기
- 하위태그 표시는 '>'