월드스토리의 코딩 나라

요소의 변환효과를 주는 함수 #. transform 2차원 변환함수1. translate(x,y) : 이동(x축, y축), translateX(x), translateY(y) : 한 축으로만 이동2. scale(x,y) : 크기를 늘리는 함수, scaleX(x), scaleY(y) : 한 축으로만 키움(배수)3. relate(degree) : 특정 각도로 테그를 회전시킴  예) 30deg4. skew(x,y): x,y 축으로 값만큼 기울임, skewX(x),skewY(y) : 특정 축으로만 기울임5. matrix(n,n,n,n,n,n) : 2차원 변환 효과 3차원 변환 함수.  transform 함수를 보충하는 속성  1. backface-visibility : 3D 변환으로 회전된 요소의 뒷면 숨김 여..

다양한 배경 속성들#background 1. background-color 요소의 배경 색상을 결정함(transparent,색상 등이 속성으로 들어감) 2. background배경을 넣을 수 있는 속성으로 뒤에는 주로 함수가 들어감. #. linear-gradient()색상이 두가지 일때 : 상하로 색 2개 지정방향과 색상 두가지 : 해당 방향으로 그라데이션을 만듬 방향|색상|색상1의 비중|색상2 : 색상1의 비중이 지정값인 그라데이션방향|색상1|색상2|색상3 : 색상을 3개 사용한 그라데이션 3. background-image  이미지가 없는 게 default url("경로") -> 이미지 경로 단, 이미지 설정값이 테그의 크기보다 작을 경우 반복출력 4. background-repeatrepeat(이..

목차   font 관련 속성들font-weight : 글자의 두깨와 관련된 속성 (대표적인 값 : (normal,400), (bold,700), bolder, lighter,100~900)#. border, lighter는 상위 요소인 부모와 비교해서 어느정도인가를 나타냄.font-size : 글자의 크기와 관련된 속성대표적인 값 : px, em, rem, %,smaller,larger, xx-small~xx-largeline-height : 한 줄의 높이, 행간과 유사대표적인 값 : 숫자, px,em, rem, %(height와 동일한 값을 넣었을 때, 가운데 정렬)font-family : 글꼴을 변경하는 속성  #lorem은 의미없는 문장을 출력해줌. 문자에 대한 속성color : 글자의 색상text..