포부리

엘리먼트에 대한 폰트 패밀리 정의 font-family: Helverica, "Times New Roan", Serif; 사용할 주요 폰트명을 정의하고 콤마로 구분한다. 폰트명은 대소문자를 구분하지 않는다. 폰트명에 공백이 있는 경우, "", ''로 감싸야한다. 폰트 vs 폰트패밀리 폰트패밀리는 'Times' 처럼 외관을 담당하고, 폰트는 italic, bold, normal, bold italic 등 특정 버전을 가리킨다. 폰트의 높이 디센더 ~ 아센더까지 측정한 값. x-height는 소문자 글자의 높이를 말한다. ⚠️디센더? g,j,p,y 대문자+소문자, q 소문자(대문자 제외) 처럼 글자의 구조상 그 아랫 부분이 기준선 아래로 내려 오게 되는 글자 ⚠️아센더? b,d,..

즉시 바뀌는게 아니라 시간이 흐름에 따라 서서히 바뀌는 것을 트랜지션이라고 생각하면 된다. 마치 영화의 프레임을 이어놓은 것 같은. # 어떤 것을 트랜지션할 수 있을까? CSS 속성 트랜지션 대상값 background-color 색상 background-image 그라디언트 background-position 퍼센트 값, 길이 border-(상하좌우-)color 색상 border-(상하좌우-)width 길이 border-spacing 길이 top, bottom, left, right 길이, 퍼센트 값 color 색상 crop 사각 영역 font-size 숫자 font-weight 숫자 grid-* 다양함 height 길이, 퍼센트 값 letter-scpaing 길이 line-height 숫자, 길이, 퍼..

2D tarnsform # 2D transform 속성값 속성값 rotate(), rotateX, rotateY 엘리먼트를 X,Y축을 기준으로 회전시킬 각도를 지정. 양수 = 시계방향, 음수는 = 반시계 방향 skew(), skewX, skewY 엘리먼트의 X,Y축을 다라 엘리먼트를 왜곡시킬 각도 지정. 양수 = 위와 왼쪽 방향, 음수 = 아래와 오른쪽 방향 scale(), scaleX, scaleY X,Y에 곱할 숫자 값을 지정한다. 양수 = 엘리먼트 크기 증가, 음수도 크기를 증가시키지만 축을 중심으로 엘리먼트를 반전시킨다. 1보다 작은 소수점 숫자를 사용하면 크기가 줄어든다. translate(), translateX, translateY 엘리먼트의 X, Y축을 따라 엘리먼트를 위치 조절할 길이 값..

'이해'란 가장 잘한 오해이고, '오해'란 가장 적나란 이해다. "너는 나를 이해하는구나." 라는 말은 내가 원하는 내 모습으로 나를 잘 오해해준다는 뜻이며, "너는 나를 오해하는구나."라는 말은 내가 보여주지 않고자 했던 내 속을 어떻게 그렇게 꿰뚫어 보았느냐 하는 것에 다름 아니다. 사람들이 흔히, 생각이 같아서 치는 맞장구에는 저절로 안도를 느끼지만, 생각의 차이 앞에서는 예민해지고 배타적이게 되므로, 그 차이를 멋진 농담으로 언급한다면, 차이가 발견될 때마다, 상대방은 흥미가 생기고 미리 기분이 좋아져서 귀를 쫑긋 세우게 된다. 비밀은 우리를 따뜻하게 결속시켜주지만, 우리를 불안에 빠뜨리기도 한다. 비밀은 단열은 잘되고 방음은 잘 되지 않는 여관방같기 때문이다.

scss 파일명앞에 _가 붙은 파일을 볼 수 있을 것이다. 왜 _를 사용할까? 만일 _없이 reset.scss를 만들고 이것을 컴파일 했다면, sass는 reset.css를 만들고 그걸 style.css에다가 import 한다. 결국 두 파일을 얻는 불필요한 일이 발생하는 것이다. 즉, _가 들어간 파일은 sass에서 사용하기는 하지만 scss에서 css로 변환하는 작업을 무시하게 해주는 역할을 한다.

scss에 걸려있는 모든 주석을 지우고 다시 빌드해볼 것.

설명 파일첨부 커스터마이징 시 필요한 소스 (+ 이미지 미리보기) function fileAttach(e) { var file = e.target; var fileList = file.files; // 읽기 var reader = new FileReader(); reader.readAsDataURL(fileList[0]); //로드 한 후 reader.onload = function() { //input text에 업로드한 파일명 꽂아주기 $(file) .next() .find("input") .val(fileList[0].name); //썸네일 꽂아주기 if ( $(file) .parent() .find(".file-image-area").length > 0 ) { $(file) .parent() .f..