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

animation3

HTML & CSS ํ™œ์šฉ ํ”„๋กœ์ ํŠธ_ ์นด๋“œ์…”ํ”Œ & ๋””์ŠคํŽœ์‹ฑ ์ฝ”๋“œ .container{ width: 500px; height: 500px; border: 1px solid #000; position: relative; } .box{ width: 100px; height: 130px; border: 1px solid #000; border-radius: 5px; position: absolute; top: 35%; left: 40%; } .btn{ width: 50px; height: 50px; border: 1px solid #000; } .box1{ background: crimson; z-index: 1; } .box2{ background: darkorange; z-index: 0; } .box3{ background:gold; z-index: 0; } .b.. 2022. 1. 28.
HTML & CSS ํ™œ์šฉ ํ”„๋กœ์ ํŠธ_ ๊ณ ์–‘์ด ๋Œ„์Šค ์• ๋‹ˆ๋ฉ”์ด์…˜ ๋งŒ๋“ค๊ธฐ ์ฝ”๋“œ *,*::after,*::after{ box-sizing: border-box; } .container { width: 200px; height: 150px; border: 2px solid #000; animation: background 2s linear 0s infinite normal ; position: relative; } .ground { width: 196px; height: 45px; bottom: 0px; position: absolute; background: rgba(37, 37, 37, 0.884); } .wall { width: 190px; height: 130px; left: 5px; background-size: contain; background-repeat: no-r.. 2022. 1. 16.
HTML & CSS ํ™œ์šฉ ํ”„๋กœ์ ํŠธ_ ๋ฒ„ํŠผ ์กฐ์ž‘ ๊ฒŒ์ž„ ๋งŒ๋“ค๊ธฐ ์ง€๊ธˆ๊นŒ์ง€ ๋ฐฐ์šด ๋‚ด์šฉ๋งŒ์„ ํ™œ์šฉํ•˜์—ฌ ๋ฒ„ํŠผ ์กฐ์ž‘์„ ํ•  ์ˆ˜ ์žˆ๋Š” ๊ฐ„๋‹จํ•œ ๊ฒŒ์ž„์„ ๋งŒ๋“ค์—ˆ๋‹ค! ์ฝ”๋“œ github(https://github.com/Bluishhot-Star/WEB/tree/master/HTML%26CSS/Btn_game) KASSID GAME VICTORY! *, *::after, *::before { box-sizing: border-box; } .title { width: 325px; text-align: center; font-weight: bold; font-size: 25px; } .game { width: 325px; height: 380px; padding: 10px; position: relative; border: 2px solid #000; background-color: gray.. 2022. 1. 14.