본문 바로가기

웹 개발40

과제- 웹 사이트 CSS(애니메이션) 적용 하기 1. 메인 페이지 애니메이션 적용하기 2. 메인 페이지의 애니메이션 CSS /* !!!애니메이션 코드!!! */ @media (max-width: 700px){ .box{ width: 50%; } .box:nth-child(2n-1){ background-color: #fff; } .box:nth-child(4n),.box:nth-child(4n-3) { background-color: #fff; } } @media (max-width: 420px){ .box{ width: 100%; } .box:nth-child(4n),.box:nth-child(4n-3){ background-color: #fff; } .box:nth-child(2n-1){ background-color:rgba(0,0,0,0.05).. 2024. 4. 15.
16. 웹 개발을 위한 기본 CSS 태그 모음 & 요약 정리6 1. css 우선순위 CSS 우선순위 div 1번(인라인 스타일 우선) div 2번(id 우선) div 3번(class 우선) div 4번(같은 속성의 경우 나중에 적용한 것이 우선) div 5번(같은 속성의 경우 나중에 적용한 것이 우선, 외부 스타일시트 적용) li 1번(점수가 높은 속성이 적용) div 6번(!important 우선)2. css변수 css 변수 김사과 반하나 오렌지 이메론 오베리 3. 카페 소개(반응형 웹 디자인)PC버전, 태블릿 버전, 모바일 버전에 대한 이미지 입니다4. transform transform or.. 2024. 4. 12.
15. CSS 스타일링 기술(우선순위&Custom&Graphic) 1. CSS 우선순위 계산1. 동일한 속성을 적용할 경우 나중에 적용한 것이 우선 2. 외부 스타일 시트와 내부 스타일 시트의 적용은 순서에 따라 나중에 적용한 것이 우선 3. 내부, 외부, 인라인 스타일 시트 중 인라인을 우선시 적용한다 4. 우선순위 계산inline: 100점 id: 100점class, 속성 선택자: 10점element: 1점5. !important를 적용하면 0 순위   2. CSS Custom PropertiesCSS의 속성 값을 재사용하고 동적을 변경할 수 있게 해주는 기능정의::root { --main color: #FF0000; --font-size: 15px;}사용:.box { background-color: var(--main-color); font-.. 2024. 4. 12.
과제- 웹 사이트 CSS 적용 하기(뉴스기사,즐겨찾기,이력서,로그인,회원가입) 1. 메인 페이지(index) 사용자가 다른 페이지로 이동할 수 있는 링크를 제공하는 내비게이션이 있습니다. 각 내비게이션 항목에 마우스 커서를 올리면 색깔이 초록색으로 변경됩니다. 위 페이지에 구성된 CSS 스타일입니다. 2. 뉴스 페이지 아래에 자소서 즐겨찾기 기능에서 마우스가 글자 위에 올라가면 언더라인이 생기는 기능이 있습니다 3. 즐겨찾기 페이지 위 페이지에 구성된 CSS 스타일입니다. 4. 자기 소개서 페이지 자기소개서 이름 곽정우 생년월일 1999/03/18 전화번호 010-1111-1111 이메일 apple@banana.com 언어 종류 수준 한글 상 영어 중 기술 종류 수준 파이썬 중상 데이터베이스 중 즐겨찾기 뉴스기사 5. 회원가입 페이지 이 페이지는 회원가입 페이지이며 비밀번호 항목에.. 2024. 4. 12.

티스토리툴바