결과물 사용 에디터 Atom Editor 요구사항 1. Enter를 쳐서 To do list에 Task 추가시키기 2. 체크 버튼 클릭시 Done List에 추가시키고 To do list 에서 없애기 3. 삭제 버튼 클릭시 Task 삭제 4. 입력창 비우기 HTML //입력 //to do list To Do List //done list Done CSS *{ margin: 0; padding: 0; box-sizing: border-box; } body{ background-image: linear-gradient(180deg, #487eb0, #ffffff); min-height: 100vh; } .container{ max-width: 800px; margin: auto; padding: 20px; ..
결과물 사용 에디터 Atom Editor 요구사항 1. 키를 입력할 때마다 검색 결과가 동적으로 변하기 HTML Search A Apple O Orange M Mandarin S Strawberry W Watermelon G Grape P Pear C Cherry CSS body{ margin: 0; padding: 0; font-family: "Montserrat"; } .searchbox{ width: 90%; margin: 10px auto; } .header{ background: #ECDFBF; overflow: hidden; padding: 20px; text-align: center; } .header h1{ text-transform: uppercase; color: white; margi..
결과물 사용 에디터 Atom Editor 요구사항 1. 아래로 스크롤을 할 때 상단에 메뉴가 고정되게 하는 함수 실행시키기 2. 함수가 실행되면 상단 메뉴 배경 색 바꿔주고 고정키기 HTML Home About Contact Close your eyes and imagine the sunrise over a wide-open country field, morning rain glistening on forest trees, and snow-covered mountaintop peaks. Yes, nature is absolutely breathtaking, which is why we rounded up these nature quotes that capture the earth’s stunning be..
결과물 사용 에디터 Atom Editor 요구사항 1. 텍스트 애니메이션 만들기 2. 버튼 클릭 시 화면 전환하기 HTML Welcome to Paya blog! I N T R O Enter CSS - 각 텍스트를 li에 넣어주기 - 애니메이션이 발생할 경우 지속될 시간을 transition으로 정하기 - 각 li의 위치를 transform: translate3d()로 지정해주기 * { margin: 0; padding: 0; } body{ font-weight: 700; } .wrapper { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-weight: lighter; font-size: 40px; } .w..
무료 글꼴 사이트 눈누 https://noonnu.cc/ * 눈누가 아니더라도 웹폰트를 지원하는 글꼴 코드가 있을 경우 가능 방법 1. 눈누에 접속해 원하는 글꼴 찾기 2. 선택한 글꼴 이름을 눌러 자세히 보기 3. 허용 여부 확인하기 4. 웹 폰트로 사용 복사하기 5. 블로그 관리 -> 스킨 편집 -> html 편집 -> CSS 6. 복사한 글을 CSS 맨 위 부분인 /* Web Font Load */ 아래에 붙여넣기 7. Ctrl + F 를 눌러 font-family를 검색해 위에 붙여넣은 글에서 글꼴 이름을 복사해 원래 있던 글꼴 대신 넣어주기 8. 모든 font-family에 7번을 적용시켜주기 9. 저장하기
prevnext 1 2 3 4 5 6 7 8 9 10 var cnt = 0; var slide_width= 200; //한페이지에 보여줄 div의 크기 var total_slide= 3; // 페이지 개수 function prev(){ cnt--; if(cnt==-1){ cnt = total_slide-1; } $('.wrapper-div ul#slider').css('left', -(slide_width*cnt)+'px'); } function next(){ cnt++; if(cnt==total_slide){ cnt = 0; } $('.wrapper-div ul#slider').css('left', -(slide_width*cnt)+'px'); } prev next 1 2 3 4 5 6 7 8 9 10
Error Message : Uncaught DOMException: Failed to execute 'captureStream' on 'HTMLCanvasElement': Canvas is not origin-clean. 캔버스에 이미지를 넣고 스트림으로 출력하기위해 captureStream()을 호출했을 때 발생하는 오류입니다. 로컬에서 작업중이시라면 보안문제로 인해 해당 오류를 볼 수 있습니다.
Error Message : Uncaught SyntaxError: await is only valid in async function await을 사용하여 호출하는 함수를 async 함수를 만들어 호출해줍니다. const start = async function() { let result = await 함수(); console.log(result); } start();
"이 블로그의 모든 포스팅은 쿠팡 파트너스 활동의 일환으로, 이에 따른 일정액의 수수료를 제공받습니다."
- Total
- Today
- Yesterday