master

分支 (1)

管理

管理

master

homework-web01
/
02_QQ官网.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>QQ-轻松做自己</title>
    <style>
        body{
            background-color: dodgerblue;
        }
        .text1{
            text-align: center;
            color: white;
        }
        #text3{
            text-align: center;
            color: white;
            padding-top: 300px;
        }
        #text2 {
            text-align: center;
            color: white;

        }
    </style>
</head>
<script>
    function onDownloadBtn(text) {
        const element = document.getElementById('text2');
        element.innerText = `欢迎下载${text}版本`
    }
</script>
<body>
<div>
    <img src="images/qq_logo.png" alt="">
    <div class="text1" style="font-size: 30px">全新版本</div>
    <div id="text2" style="font-size: 60px">QQ9</div>
<div id="text3">
    <button onclick="onDownloadBtn('IOS')">IOS</button>
    <button onclick="onDownloadBtn('Android')">Android</button>
    <button onclick="onDownloadBtn('Windows')">Windows</button>
    <button onclick="onDownloadBtn('MacOS')">MacOS</button>
</div>
</div>
</body>
</html>