CSS(3)
✅Transform HTML 요소의 모양, 크기, 위치 등을 자유롭게 바꿀 수 있음 움직이기, 회전, 크기변경, 기울기변경 등의 동작 제공 CSS 좌표 체계 x, y, z 좌표를 갖음 기준점 : 브라우저의 왼쪽 상단 transform을 위해 제공되는 메소드 translate() x축 또는 y축 이동 #trans { transform: translate(100px, 50px); } rotate() 시계방향 또는 반시계방향으로 회전 #rotate { transform: rotate(30deg); } scale() x축 또는 Y축으로 확대/축소 scale(x축 배율, y축 배율) #scale_inc { transform: scale(1.5, 2); } skew() skew() : x축과 y축 방향으로 기울임 ..
2023. 2. 7.
CSS(2)
✅디스플레이 display 속성 해당 HTML 요소가 웹 브라우저에 언제 어떻게 보이는가를 결정 display 속성의 기본값 블록(block) 인라인(inline) display 속성값이 block인 대표적인 태그 , , , , , display 속성값이 inline인 대표적인 태그 , , display 속성의 기본 설정값의 변경가능 속성 값을 변경 한다고해도 해당 요소가 완전히 다른 타입의 요소로 바뀌는 것은 아니며, 본래의 속성도 가지고 있음 inline-block 인라인-블록 요소는 인라인 요소와 비슷하지만, 너비와 높이, margin을 설정할 수 있음 인라인-블록으로 설정된 요소는 해당 요소 자체는 인라인(inline) 요소처럼 동작, 하지만 해당 요소 내부에서는 블록(block) 요소처럼 동작 ..
2023. 2. 6.
