JavaScript | 𝗢𝗳𝗳𝗶𝗰𝗶𝗮𝗹 𝗰𝗵𝗮𝗻𝗻𝗲𝗹

#HTML #CSS #Tavsif
Balandlikka nisbatan norma holatga keladi

🔗 t.me/absJavaScript

👍2⚡1❤‍🔥1🏆1🆒1

31 viewsツ, edited 17:52

margin-left: 15px;
margin-right: 15px;
margin-top: 15px;
margin-bottom: 15px;

#HTML #CSS #Tavsif #Margin
Margin ramka tashqarisidan boʻshliq qoʻshib beradi ahamiyat bergan boʻlsangiz barcha saytlar oʻrtada joylashgan. Ularning ramkasiga

margin-left: auto;
margin-right: auto;
}

berilgan boʻladi. Bular faqat ularga "width" berilganda ishlaydi yani ↔️ kenglik.

🔗 t.me/absJavaScript

❤‍🔥1⚡1👍1🔥1🏆1🆒1

37 viewsツ, edited 17:56

JavaScript | 𝗢𝗳𝗳𝗶𝗰𝗶𝗮𝗹 𝗰𝗵𝗮𝗻𝗻𝗲𝗹

padding-left: 15px;
padding-right: 15px;
padding-top: 15px;
padding-bottom: 15px;

#HTML #CSS #Tavsif #Padding
Padding esa ichidan
yani
padding-left: 15px; chapdan oʻngga
padding-right: 15px; oʻng tomonidan chapga
padding-top: 15px; tepasidan boshlab elemntgacha
padding-bottom: 15px; pastidan elemntgacha

🔗 t.me/absJavaScript

❤‍🔥1⚡1👍1🔥1🏆1🆒1

39 viewsツ, edited 17:58

JavaScript | 𝗢𝗳𝗳𝗶𝗰𝗶𝗮𝗹 𝗰𝗵𝗮𝗻𝗻𝗲𝗹

#HTML #CSS #Tavsif #Padding

🔗 t.me/absJavaScript

👍2⚡1❤‍🔥1🏆1🆒1

35 viewsツ, edited 06:55

JavaScript | 𝗢𝗳𝗳𝗶𝗰𝗶𝗮𝗹 𝗰𝗵𝗮𝗻𝗻𝗲𝗹

(Foydali boʻlsa reaksiya goo)

🔗 @absJavaScript

❤‍🔥2🔥2🆒2❤1👍1🤩1

112 viewsedited 13:23

JavaScript | 𝗢𝗳𝗳𝗶𝗰𝗶𝗮𝗹 𝗰𝗵𝗮𝗻𝗻𝗲𝗹

#challenge #HTML #CSS #JS
Nima chiqdi? Comment goo…

✅ HTML:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./style.css">
</head>

<body>
    <div id="orange" class="box"></div>
    <div id="green" class="box"></div>
    <div id="blue" class="box"></div>
    <div id="red" class="box"></div>
    <div id="yellow" class="box"></div>
    <script src="./app.js"></script>
</body>

</html>

✅ CSS:

body {
    display: flex;
    gap: 50px;
}

.box {
    width: 100px;
    height: 100px;
    cursor: pointer;
}

.box:nth-child(1) {
    background-color: orange;
    border-radius: 100%;
}

.box:nth-child(2) {
    background-color: green;
    border-radius: 100%;
}

.box:nth-child(3) {
    background-color: blue;
    border-radius: 100%;
}

.box:nth-child(4) {
    background-color: red;
    border-radius: 100%;
}

.box:nth-child(5) {
    background-color: yellow;
    border-radius: 100%;
}

✅ JS:

let box = document.querySelectorAll('.box')
let body = document.querySelector('body')

for (let i = 0; i < box.length; i++) {
    box[i].addEventListener('click', function () {
        body.style.background = box[i].id
    })
}

⚡️JavaScript

💫 Hoziroq obuna bo'ling va do'stlarga ham ulashib qo'ying

✅ https://t.me/absJavaScript

👍2🆒2❤‍🔥1⚡1

76 viewsedited 10:14

About

Blog

Apps

Platform