๐ ์ฒ์ ํ์ด๋ถ๊ณผ ํ๋ก์ ํธ(?)๋ฅผ ํ๋ ๋ ์ด๋ผ ์ด์ง ๊ธด์ฅํ๋ค. ๋จ์ํ ๋ฌธ์ ํธ๋ ๊ฒ์ด ์๋ ๊ณ์ฐ๊ธฐ์ ๋ชฉ์ ์ ์ ์ํด์ผํ๋ ๊ณผ์ ์ ๊ฐ์ด ํ๋ ๊ฒ์ด๋ผ ๋ฐฉํฅ ์ก๋ ๋ฒ ๋ถํฐํด์ ์กฐ๊ธ ์๊ฐ์ ํด๋์๋ค.
๐ ์ค๋ ํ์ตํ ๋ด์ฉ
CSS
- FlexBox
Python ์๊ณ ๋ฆฌ์ฆ ํ์ด
- [Baekjoon]์คํฐ์
๊ณ์ฐ๊ธฐ ๋ชฉ์ ๋ฐ CSS ๋์์ธ
Flexbox๋ฅผ ์ฌ์ฉํด์ ๊ณ์ฐ๊ธฐ ๋ชฉ์ ๋ฐ ๋์์ธ์ ํ๋ ๊ฒ์ ํ์ด๋ถ๊ณผ ๊ฐ์ด ํ๋ค. ๊ฐ์ด ํ๋ ๊ณผ์ ์์ ๋ด๊ฐ ์ ๋ฌธ์ ์ธ ์ฉ์ด๋ฅผ ๋ง์ด ์ฌ์ฉํ์ง ์๋ ๋ค๋ ๊ฒ์ ํญ์ ๋๋ผ๊ณ ์๋ค. ์กฐ๊ธ ๋ ๊ณต๋ถํด์ผ๊ฒ ๋ค!!
๐ ์ถ๊ฐ๋ก ๊ณต๋ถํ ๋ด์ฉ
Entity Code
Flexbox ์ฌ์ฉ๋ฒ
JavaScript๋ก ๊ณ์ฐ๊ธฐ ๊ตฌํ๋ฐฉ๋ฒ
ํ์ด๋ถ๊ป์ Entity Code๋ผ๊ณ ๋งํ์ ๋ ๋ฐ๋ก ์ด๊ฑฐ๋ผ๊ณ ๋ง์ ๋ชปํ๊ณ ๊ฐ์๊ธฐ ์ํ์๊ฒ ๋ณํ๋ค. ํน์๋ฌธ์๋ฅผ codeํํ๋ก ์์ฑํ๋ ๊ฒ์ด๋ผ๋ ๊ฒ์ ์๊ณ ์์ง๋ง ์ฉ์ด๋ฅผ ์ ๋๋ก ์์ง ๋ชปํ๊ธฐ ๋๋ฌธ์ด๋ค. ๋์ฑ ์ด์ฌํํ์!!
๊ณ์ฐ๊ธฐ ๋ชฉ์ ์ ๊ฐ์ง๊ณ JS๋ก ๊ตฌํํ๋ ๊ฒ์ด ๊ธ์์ผ๋ ์๋ค. ๊ตฌํ์ด๊ธฐ ๋๋ฌธ์ ๋ง์ ์๊ฐ์ด ๊ฑธ๋ฆด ์๋ ์๋ค๊ณ ์๊ฐํ์ฌ ์กฐ๊ธ์ด๋ผ๋ JS๋ฅผ ์ฌ์ฉํด์ Dom์ ์กฐ์ํ๋ ๋ฐฉ๋ฒ์ ๋ํด ์์๊ฐ๋ฉด ๊ทธ๋ ํ์ด๋ถ๊ณผ ๋์๊ฒ ๋์์ด ๋ ๊ฑฐ๋ผ ์๊ฐํ๋ค!!
๐ ์ค๋ ๋๋์ & ๋ง์ ๊ฐ์ง
- FlexBox์ ์์ฑ์ด ๊ต์ฅํ ๋ง์์ ์ฌ์ฉํ ๋ ๋ถ๋ชจ, ์์ ์ด๋ ๋ถ๋ถ์ ์์ฑํด์ผ ํ๋์ง ์ ๋๋ก ์์๋ณด์!!
- JS๋ ์ธ์ ๋ ์ค์ํ๋ค. ์ด์ฌํ ํด์ผํ๋ค!!
'Daily > Today I Learned' ์นดํ ๊ณ ๋ฆฌ์ ๋ค๋ฅธ ๊ธ
22.05.05_TIL (0) | 2022.05.05 |
---|---|
22.05.04_TIL (0) | 2022.05.04 |
22.05.02_TIL (0) | 2022.05.02 |
22.05.01_TIL(์ผ์ฃผ์ผ๊ฐ ํ๊ณ ) (0) | 2022.05.01 |
22.04.30_TIL (0) | 2022.04.30 |