여러가지 방법이 있지만, 가장 쉽게 스켈레톤 스크린은, 안에 데이터가 불러오는동안 없을경우 :empty css 를이용하면 간단히 작업할 수 있습니다. 스켈레톤 스크린(스플래시 스크린)은 스크린이 로드 중임을 나타낼 때 빈 스크린(우리 컨트롤) 및 스피너와 비교할 때 지속 시간이 짧다고 인식되지만 많이 그렇지는 않습니다 스켈레톤 화면은 점진적 콘텐츠 로드를 막지 않아야 합니다(실제 콘텐츠는 데이터가 사용 가능할 때 즉시 스켈레톤 개체를 대체해야합니다). 오늘날 사용되는 스켈레톤 스크린의 대부분은 스플래시 스크린이며, 루크 브로 블 스키 (Luke Wroblewski)가 묘사 한 원래 방식의 스켈레톤 스크린이 아닙니다 .[출처] 스켈레톤 스크린에 대해 알아야 할 모든 것|작성자 YEOJUING See the..
Hover Effect Hover Effect (1) See the Pen Hover Effect by jeongahlee (@jeongahlee) on CodePen. Hover Effect (2) See the Pen Hover Effect 3 by jeongahlee (@jeongahlee) on CodePen. Hover Effect (3) See the Pen Hover - Effect3 by jeongahlee (@jeongahlee) on CodePen. Hover Effect (4) See the Pen Hover-Effect 4 by jeongahlee (@jeongahlee) on CodePen. Hover Effect (5) See the Pen Hover Effect5 by jeon..
컨텐츠 요소를 가운데 정렬하는 방법 인라인 구조를 가운데 정렬하는 방법 (text-align : center;) 블록 요소를 가운데 정렬하는 방법(margin: 0 auto;) 테이블을 이용한 가운데 정렬하는 방법(기본적인 방법 : display: table-cell; ,vertical-align: middle;) 포지션을 이용한 가운데 정렬하는 방법 1 (margin) 포지션을 이용한 가운데 정렬하는 방법 2 (transform: translate(-50%, -50%);) 포지션을 이용한 가운데 정렬하는 방법 3 (margin:auto; , left: 0; top: 0; right: 0; bottom: 0;) 포지션을 이용한 가운데 정렬하는 방법 4 ( displat: flex;) 인라인 구조를 가운데..
CSS Selector 태그 유형 설명 버전 . .class {color:#fff;} 클래스 선택자 CSS1 # .id {color:#fff;} 아이디 선택자 CSS1 * * {color:#fff;} 전체 선택자 CSS2 element p {color:#fff;} 요소 선택자 CSS1 element, element p, div {color:#fff;} 그룹 선택자 CSS1 element element div p {color:#fff;} 후손 선택자 CSS1 element > element div > p {color:#fff;} 이웃 선택자 CSS2 element + element div > p {color:#fff;} 자식 선택자 CSS2 element ~ element div ~ p {color:#ff..