from a beginner to a Web Publisher from a beginner to a Web Publisher

transform 의 3d속성들 기본적으로 transfrom을 사용해 봤을테지만, 거의 2d 위주로 사용해 왔다. 그래서 3d 속성들에 대해 알아보고 기록하고자 한다. 익숙해질때까지 연습하자. See the Pen 3d transform and transform-origin by builderous (@nyjchoi) on CodePen. 자세한 설명은 위의 코드펜에 주석으로 설명을 달았다. 정리하자면, transform-origin : x축 y축; 이렇게 써주면 되는데, 기본값은 50% 50%d이다. 즉 대상의 딱 가운데가 중심인 것이다. x축 left,right, center, %, 단위(px 등) y축 : top, bottom, center, %, 단위(px 등) 그리고 3d의 원근값을 적용시키려면..

기본문법 : CSS Syntax background-image: radial-gradient(shape size at position, start-color, ..., last-color); background-image를 단축해서 background 로 적어줘도 된다. background-color 에서는 그라디언트가 적용되지 않더라. shape size at position ​ shape size: 기본은 ellipse (타원)이다. 따라서 생략하면 타원으로 설정된다.(grad1, grad2) 정원을 선택한다면 circle을 앞에 적어준다. (grad3) ​ See the Pen background-image: radial-gradient(ellipse, circle) by builderous (@n..