Chap07. 개발일지 - CSS/calc
수직중앙정렬 See the Pen calc01 by lee-hyuna (@lee-hyuna) on CodePen. 플렉서블영역/고정영역 See the Pen calc02 by lee-hyuna (@lee-hyuna) on CodePen. backorund-position See the Pen calc03 by lee-hyuna (@lee-hyuna)
Tag: 개발일지
Chap06. 개발일지 - CSS/Clip
Clip을 이용하여 원그래프 만들기 clip 속성을 이용하여 도형을 그리고 border-radius로 원형을 표현하여 원그래프를 css로 표현 css animation을 이용하여 액션을 표현할 수도 있음 부모, 자식 요소를 부모로 왼쪽을 가리고 자식으로 반대도형을 오른쪽에 표현하여 반원을 점점 채우는걸 표현 clip:rect(top, right, botto
Chap05. 개발일지 - 클로저 기초예제
오랜만에 스터디 하는 겸 개발일지를 적어본다 :^)나한테 주어진 2주차 과제는 for문을 돌려서 alert로 버튼안의 숫자들 (1,2,3,4,5)찍기였다.innerHTML, innerText 등등 태그안의 값을 가져오지 않고 index로만 가져오는 문제 즈엉답 ::: 123456789101112131415<script> // for문 돌려서 a
Chap04. 개발일지 - preload
관련문서 : http://zuu.kr/jank 웹폰트 관련 문서를 보다 preload에 대한 정리가 있으면 좋을 것 같아서 남긴다 :^) Function API12345678<head>...<script id="loadcss"> // load a CSS file just before the script element
Chap02. 개발일지 - OpenType Variable Fonts
오픈타입 가변 폰트기존에는 폰트파일 하나당 하나의 스타일만 적용 가능 했다. 예를 들어 폰트 하나에 Bold, Italic, Light 등의 스타일을 클라이언트에서 로드하려면 각각의 스타일에 해당하는 총 3개의 폰트 파일이 필요했다.이번에 제공되는 오픈타입 가변 폰트를 사용하면 하나의 파일만으로도 수많은 폰트 스타일을 적용할 수 있다. 12345678910
Chap03. 개발일지 - backface-visibility
예전에 모웹 마크업작업에서 버튼을 2개 겹쳐놓고 애니메이션으로 전환하는 작업을 진행하다,특정 디바이스에서 버벅 거리는 현상이 있었다. 구글링한 결과 이변가시성에 대한 글이 있었는데, 참고하고자 남긴다 :^) backface-visibility 속성3D transform과 연관되어 있으며, 겹쳐졌을 경우 뒷면의 가시성을 결정하는 속성이다변형이 가해져 요소의
Chap01. 개발일지 - element size
offsetWidth / offsetHeight일반적으로 엘리먼트의 전체 크기를 가져옴.해당 속성은 엘리먼트의 padding, border, scrollbar 를 포함한 값을 리턴함 clientWidth / clientHeight실제로 보여지고 있는 컨텐츠가 얼마만큼 공간을 차지하고 있는지 확인하고 싶다면 해당 속성을 사용할 것이 속성은 border와 sc