728x90 반응형 KDT82 자바스크립트 역사 & 특징 1995년 넷스케이프커뮤니테이션즈: 네비게이터 브라우저가 90% 이상의 점유율 1996년 브렌던 아이크: 동적인 프로그램을 개발하기 위해 언어(모카, 10일만에 개발) 개발 네비게이터2에 탑재(모카 → 라이브스크립트 → 자바스크립트 이름 변경) MS의 익스플로러의 jscript 호환성 문제로 크로스 브라우징 이슈가 발생 1997년 자바스크립트는 ECMAScript(비영리 표준화 기구 ECMA 인터내셔널)로 명명됨 1999년 비동기적(Asynchronous) 서버와 브라우저가 데이터를 교활할 수 있는 통신 기능 Ajax(Asynchronous Javascript and XML)이 탄생 2005년 구글이 발표한 구글맵에 Ajax 기술을 사용 크롬 발표함(V8 자바스크립트 엔진) 2006년 jQuery 등장으.. 2023. 4. 5. CSS 우선순위 1. 동일한 속성을 적용할 경우 나중에 적용한 것이 우선 2. 외부 스타일시트와 내부 스타일시트의 적용은 순서에 따라 나중에 적용한 것이 우선 3. 내부, 외부, 인라인 스타일 시트 중 인라인을 우선시 함 4. 계산식 inline: 1000점 id 속성: 100점 class, 속성 선택자: 10점 element: 1점 5. !important를 적용하면 0순위 2023. 4. 5. Animation 요소의 현재 스타일을 다른 스타일로 변환 @keyframe 시작: 0%, from 과정: 1%, 3%, 10%, .. 끝: 100%, to 0% 5% 50% ... 100% 장면1 장면2 장면3 끝장면 animation-name: 애니메이션의 이름을 설정 animation-fill-mode: 애니메이션이 끝난 후 어떻게 처리할지 설정 forwards: 애니메이션 키프레임이 완료되었을 때 마지막 프레임을 유지 animation-direction: 애니메이션의 진행 방향을 정하는 속성 reverse: 반대 순서로 진행 alternate: 정해진 순서로 진행했다가 다시 반대순서로 돌아감 reverse-alternate: 반대 순서로 진행했다가, 다시 정해진 순서로 돌아감 animation-duration: 애.. 2023. 4. 5. Transition 요소에 추가할 css 스타일 전환효과를 설정 추가할 전환 효과나 지속시간도 설정 property: 요소에 추가할 전환효과를 설정 timing-function: 전환효과의 값을 설정 ㄴ linear: 처음부터 끝까지 일정한 속도 ㄴ ease: 전환효과가 천천히 -> 빨라지고 -> 천천히 -> 끝 duration: 전환 효과를 나타내는 시간을 설정 delay: 설정한 시간만큼 대기하다가 전환효과를 나타냄 2023. 4. 5. Transform 2차원 좌표에서 요소를 변형시키는 속성 translate: 이동 rotate: 회전 scale: 확대, 축소 skew: 경사, 비틀기 벤더 프리픽스(vender prefix) 주요 웹 브라우저 공급자가 새로운 실험적인 기능을 제공할 떄 이전 버전의 웹 브라우저에 그 사실을 알리기 위해 사용하는 접두사 W3C CSS 권고안에 포함되지 않은 기능이나, 포함되어 있지만 아직 완벽하게 제정된 상태가 아닌 기능을 사용할 때 붙임 -webkit-: 크롬, 엣지를 위한 접두사 -o-: 오페라를 위한 접두사 -ms-: 익스플로러를 위한 접두사 -mox-: 파이어폭스를 위한 접두사 해당 속성이 적용되지 않았을 경우 표현해야 할 코드를 가장 먼저 작성해야 하며, 표준 문법 코드는 가장 마지막에 작성해야 한다. linear.. 2023. 4. 5. 미디어 쿼리(Media Query) 반응형 웹 하나의 웹사이트에서 PC, 스마트폰, 태블릿 등 접속하는 디스플레이 종류에 따라 화면의 크기가 자동으로 변하도록 만든 웹페이지 접근 방법 @media 매체유형 and (속성에 대한 조건) { css 코드 ... } 매체 유형 all: 모든 매체 screen: 컴퓨터, 태블릿 print: 프린터 speech: 스크린 리더 예제 코드1 HTML 미디어 쿼리1 예제 코드2 HTML INSTAGRAM YOUTUBE FACEBOOK TWITTER Lorem ipsum dolor sit, amet consectetur adipisicing elit. Dicta quibusdam obcaecati, harum, culpa recusandae quo quisquam maiores eum exercitatio.. 2023. 3. 30. 이전 1 2 3 4 5 6 ··· 14 다음 728x90 반응형
