https://user-images.githubusercontent.com/83990943/149663581-207ae692-a465-46be-bbf0-90e82fb68db9.png

Untitled

๐Ÿšฉ์„ ํƒ๋ฏธ์…˜

<aside> โš™ js ์ฝ”๋“œ ์น˜๊ณ , ์ถ”๊ฐ€๋กœ css ์ ์šฉ์„ ํ–ˆ๋‹ค. ์ง„์งœ ๋ฟŒ๋“ฏ๋ฟŒ๋“ฏํ–ˆ๋‹น ํžˆํžˆ

</aside>

Untitled

Untitled

Untitled

Untitled

Untitled

์—ด์‹ฌํžˆ ์งœ๋ณธ + ๋”ฐ๋ผ์นœ ์ฝ”๋“œ (๏ฝก๏ฝฅโˆ€๏ฝฅ)๏พ‰๏พž

6์ฃผ์ฐจ

๐Ÿšฉ๊ธฐ๋ณธ๋ฏธ์…˜

<aside> โš™ 315p. ์ง์ ‘ํ•ด๋ณด๋Š” ์†์ฝ”๋”ฉ ์‹คํ–‰ ํ›„ ์ถœ๋ ฅ๋˜๋Š” ๊ณ ์–‘์ด ์ด๋ฏธ์ง€ ์บก์ณํ•˜๊ธฐ!

</aside>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <script>
        document.addEventListener('DOMContentLoaded', () => {
            const rects = document.querySelectorAll('.rect')

            rects.forEach((rect, index) => {
                const width = (index + 1) * 100
                const src = `http://placekitten.com/${width}/250`
                rect.setAttribute('src', src)
            })
        })
    </script>

    <img class="rect">
    <img class="rect">
    <img class="rect">
    <img class="rect">
</body>
</html>

์šฐ์™• ์ง„์งœ ์‹ ๊ธฐํ•ด!

์šฐ์™• ์ง„์งœ ์‹ ๊ธฐํ•ด!