๋ณธ๋ฌธ ๋ฐ”๋กœ๊ฐ€๊ธฐ

CSS

CSS ๋ฏธ๋””์–ด์ฟผ๋ฆฌ๋กœ ๋ฐ˜์‘ํ˜• ์›น ๋””์ž์ธํ•˜๊ธฐ (with flex-box)
Computer Programming/CSS 2023. 6. 8. CSS ๋ฏธ๋””์–ด์ฟผ๋ฆฌ๋กœ ๋ฐ˜์‘ํ˜• ์›น ๋””์ž์ธํ•˜๊ธฐ (with flex-box) 1. ๋ฏธ๋””์–ด์ฟผ๋ฆฌ (Media Queries)๋ž€? ๋ฏธ๋””์–ด ์ฟผ๋ฆฌ๋Š” ์›น ํ™”๋ฉด์„ ๋ณด๋Š” ๋””๋ฐ”์ด์Šค (ํœด๋Œ€ํฐ, ํƒœ๋ธ”๋ฆฟ, ๋ฐ์Šคํฌํƒ‘ ๋“ฑ)์— ๋”ฐ๋ผ ์›น์‚ฌ์ดํŠธ๋‚˜ ์•ฑ์˜ ์Šคํƒ€์ผ์„ ์ˆ˜์ •ํ•  ๋•Œ ์‚ฌ์šฉํ•˜๋Š” ํˆด์ด๋‹ค. ๊ฐ๊ฐ์˜ ๋””๋ฐ”์ด์Šค์— ์–ด๋–ค ํŠน์„ฑ์ด๋‚˜ ์ˆ˜์น˜(ํ™”๋ฉด ํ•ด์ƒ๋„, ๋ทฐํฌํŠธ, ๋„ˆ๋น„ ๋“ฑ)์— ๋”ฐ๋ผ ์Šคํƒ€์ผ ๋ฐ ๋ ˆ์ด์•„์›ƒ์„ ์ˆ˜์ •ํ•  ์ˆ˜ ์žˆ๊ธฐ ๋•Œ๋ฌธ์— ๋ฐ˜์‘ํ˜• ์›น์‚ฌ์ดํŠธ๋ฅผ ์ œ์ž‘ํ•  ๋•Œ ์‚ฌ์šฉ๋œ๋‹ค. 2. ๋ฏธ๋””์–ด์ฟผ๋ฆฌ ์‚ฌ์šฉ ๋ฐฉ๋ฒ• ๋ฏธ๋””์–ด ์ฟผ๋ฆฌ๋Š” @media ๊ทœ์น™์„ ์‚ฌ์šฉํ•ด์„œ ์ •์˜๋œ๋‹ค. @media media-type and (media-feature) { /* ์Šคํƒ€์ผ ๋ฐ ๋ ˆ์ด์•„์›ƒ ๊ทœ์น™ */ } /* 600px ์ด์ƒ์˜ ๋„ˆ๋น„๋ฅผ ๊ฐ€์ง„ ๋ทฐํฌํŠธ์— ์ ์šฉ๋˜๋Š” ์Šคํƒ€์ผ */ @media screen and (min-width: 600px) { /* ์Šคํƒ€์ผ ๋ฐ ๋ ˆ์ด์•„์›ƒ ๊ทœ์น™ */ } ..
๐ŸŽฎ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋กœ 2D ๊ฒŒ์ž„ ๊ฐœ๋ฐœํ•˜๊ธฐ (๋ธ”๋Ÿญ๋งž์ถ”๊ธฐ) | canvas, JQuery, localStorage ์‚ฌ์šฉ
Computer Programming/Javascript 2023. 6. 6. ๐ŸŽฎ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋กœ 2D ๊ฒŒ์ž„ ๊ฐœ๋ฐœํ•˜๊ธฐ (๋ธ”๋Ÿญ๋งž์ถ”๊ธฐ) | canvas, JQuery, localStorage ์‚ฌ์šฉ 1. ํ”„๋กœ์ ํŠธ ๊ฐœ์š” ์›น๋ฏธ๋‹ˆ ํ”„๋กœ์ ํŠธ๋กœ html, css, javascript ๊ทธ๋ฆฌ๊ณ  JQuery๋ฅผ ์ด์šฉํ•ด ๊ฐ„๋‹จํ•œ ๊ฒŒ์ž„์„ ๊ฐœ๋ฐœํ•˜๋Š” ํ”„๋กœ์ ํŠธ๋ฅผ ์ง„ํ–‰ํ–ˆ๋‹ค. https://developer.mozilla.org/en-US/docs/Games/Tutorials/2D_Breakout_game_pure_JavaScript 2D breakout game using pure JavaScript - Game development | MDN In this step-by-step tutorial we create a simple MDN Breakout game written entirely in pure JavaScript and rendered on HTML . developer.mozilla.org ์œ„์˜ Mozilla d..

ํ‹ฐ์Šคํ† ๋ฆฌํˆด๋ฐ”