https://taehyunkim3.github.io/carrotgame1/ Carrot Game taehyunkim3.github.io READY 9 * { box-sizing: border-box; } html, body { } body { margin: 0; padding: 0; text-align: center; width: 100%; height: 100%; display: flex; background-color: beige; flex-direction: column; align-items: center; padding-top: 20px; } .main { background-image: url("img/background.png"); background-size: cover; backgrou..
https://ssocoit.tistory.com/251 [CSS] 부모 엘리먼트를 기준으로 position: absolute의 offset 주기 오랜만에 글을 작성해봅니다. 그동안 다양한 일들이 있어서 약 2주간 글이 끊겨버렸네요.. 시간이 늦었지만 무엇이라도 글을 작성해야겠다는 생각이 들어 이렇게 블로그에 다시 들어오게 되었 ssocoit.tistory.com 부모 엘리먼트가 relative이고, 해당 요소가 absolute인 경우 부모엘리먼트 안에서 배치가 가능하다. .playground { bottom: 0px; width: 100%; height: 60%; background: transparent; border: 3px solid black; bottom: 0px; position: relat..
function gameset() { let COUNT_START = 200; // seconds * hours let count = COUNT_START; let playing = false; playpause = document.querySelector('.start'); playpause.onclick = function () { if (playing) { playing = false; console.log("Pause!"); playpause.innerHTML = ` `; } else if (!playing) { playing = true; console.log("Play!"); playpause.innerHTML = ``; } } function countdown() { displayTime()..
으아.... 간단한 자바스크립트 게임 만들기 프로젝트를 시작했는데 게임은 커녕 카운트다운 타이머 만드는것 조차 이렇게 어렵다니 겨우 찾은 카운트다운 타이머 만들기 예제 https://www.youtube.com/watch?v=PIiMSMz7KzM https://codepen.io/dcode-software/pen/XWgyOpg Easy Countdown Timer with JavaScript Taken from my YouTube video: https://youtu.be/PIiMSMz7KzM In today's video we'll be building a simple countdown timer using HTML, CSS and JavaScript. ... codepen.io class Timer ..
Shopping List Clone * { box-sizing: border-box; /* padding, border가 width height에 포함됨 */ } ul { padding: 0; } body { background-color: #e8e8ff; text-align: center; } button { outline: none; background: transparent; border: none; cursor: pointer; } .list { width: 400px; margin: auto; background-color: #f1f0f7; border-radius: 20px; -webkit-box-shadow: 5px 5px 15px 5px #000000; box-shadow: 5px 5px ..
