파비콘 1. 네이버에서 ico 컨버터 검색 2. Bitmap To Icon Converter 설치 3. Photoshop에서 Favicon 제작 4. Bitmap To Icon Converter로 ico 파일 제작 5. HTML 문서에 포함 regular Easy, readable icons that blend right in. CSS 2022.11.18
미디어쿼리 ※ 미디어쿼리의 개요 반응형 웹을 구현할 때 여러가지 해상도를 가지고 있는 디바이스에 맞춰서 스타일 시트를 적용할 수 있도록 한다.(디바이스의 해상도에 맞게 스타일시트를 적용) ※ 디바이스의 웹 브라우저 해상도 1. 데스크탑: 모니터 해상도와 웹 브라우저 해상도가 같다. 4k: 3840px FHD: 1920px Notebook: 1920px Laptop: 1440px 19인치 LCD: 1280px 17인치 LCD: 1024px 2. 모바일: 디스플레이 해상도와 웹 브라우저 해상도가 다르다. 태블릿: 768px, 820px 스마트폰: 360px, 420px ※ 미디어쿼리 중단점 지정 첫번째 영역: 1600px 이상 두번째 영역: 1000px 이상 1599px 이하 세번째 영역: 760px 이상 999px .. CSS 2022.11.16
애니메이션(2) ※트랜지션+트랜스폼과 애니메이션의 다른점 트랜지션+트랜스폼은 시작점과 끝점만 존재한다. 하지만 애니메이션은 시작점과 중간점, 끝점이 존재한다. ※애니메이션 구현 방법 1. 애니메이션 등록: @keyframes를 사용해서 등록한다. @keyframes 애니메이션이름 { 0% { 스타일속성:스타일값; } 50% { 스타일속성:스타일값; } 100% { 스타일속성:스타일값; } } 2. 애니메이션 적용: animation 스타일 속성을 사용해서 적용한다. 선택자 { animation:애니메이션이름 진행시간 가속도 대기시간 반복횟수 방향지정; } 결과 CSS 2022.11.16
애니메이션(1) 애니메이션: 박스의 진행정도(0~100%)에 따라 스타일 시트를 적용할 수 있다. animation-name: 애니메이션 이름으로 지정한 애니메이션 효과를 사용한다. animation-duration: 애니메이션 진행 시간을 지정(0.8s, 2s 등) animation-timing-fucntion: 애니메이션 속도 변화 유형 지정 linear: 일정한 속도 ease: 빠르게 시작한 후 부드럽게 끝남 ease-in: 부드럽게 시작한 후 빠르게 끝남 ease-out: 부드럽게 시작한 후 빨라진 뒤 부드럽게 끝남 ease-in-out: 부드럽게 시작한 후 부드럽게 끝남 animation-delay: 애니메이션의 대기 시간을 지정(0.4s, 0.8s 등) animation-iteration-count: 애니메이.. CSS 2022.11.16
트렌스폼 translateX() translateY() translate() scaleX() scaleY() scale() skew() rotate() transform-origin 박스 기준점 변경 결과 CSS 2022.11.16
테이블 지역 프로축구 팀 일정 울산 울산 vs 서울 2022.10.04 기흥 기흥 vs 울산 2022.10.05 서울 서울 vs 기흥 2022.10.06 결과 CSS 2022.11.16
다단으로 편집하기 많은 피어나듯이 사람들의 소학교 그러나 이네들은 가난한 버리었습니다. 피어나듯이 없이 지나가는 시인의 헤일 흙으로 이름자 나는 듯합니다. 어머니 이름과 풀이 못 둘 노루, 별빛이 내 무덤 있습니다. 많은 피어나듯이 사람들의 소학교 그러나 이네들은 가난한 버리었습니다. 피어나듯이 없이 지나가는 시인의 헤일 흙으로 이름자 나는 듯합니다. 어머니 이름과 풀이 못 둘 노루, 별빛이 내 무덤 있습니다. 많은 피어나듯이 사람들의 소학교 그러나 이네들은 가난한 버리었습니다. 피어나듯이 없이 지나가는 시인의 헤일 흙으로 이름자 나는 듯합니다. 어머니 이름과 풀이 못 둘 노루, 별빛이 내 무덤 있습니다. 결과 CSS 2022.11.16