头像在姓名上方，背景颜色会随着网页大小改变-Go服务器开发

感谢您的反馈。下面是根据您的要求进行了修改的代码，头像位于姓名上方，并且背景颜色会随着网页大小改变：

<!DOCTYPE html>
<html>
<head>
    <title>px的网页</title>
    <style>
        body {
            background: linear-gradient(to bottom, skyblue, white);
            margin: 0;
        }
        
        .container {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            height: 100vh;
        }
        
        h1 {
            margin-bottom: 20px;
        }
        
        img {
            width: 150px;
            height: 150px;
            border-radius: 50%;
            object-fit: cover;
        }
        
        select {
          margin-bottom: 10px;
        }
        
        .red-text {
          color: red;
          font-weight:bold; 
          /* 可以根据需要添加其他样式 */
        }
    </style>
</head>
<body>
    <div class="container">
      
      	<img src="your-avatar.jpg" alt="头像">
      
      	<h1>姓名：<span id="name">[你的姓名]</span></h1>

      	<p>Email：<span id="email">[你的邮箱]</span></p>

      	<p>爱好：
          	<select id="hobby" onchange="changeColor()">
                <option value="">选择爱好</option>
                <option value="篮球">篮球</option>
                <option value="足球">足球</option>
                <option value="游泳">游泳</option>
                <!-- 添加更多选项 -->
          	</select>
      	</p>

      	<p>专业：<span id="major">[你的专业]</span></p>

      	<p>学号：<span id="student-id">[你的学号]</span></p>
    </div>

    <script src="main.js"></script><!-- 将相关JavaScript代码放在名为main.js的文件中 -->
</body>
</html>

同样，在main.js文件中，使用下面的代码替换之前的代码：

window.addEventListener("resize", function() {
    var body = document.querySelector("body");
    var windowHeight = window.innerHeight;
    body.style.backgroundSize = "100% " + windowHeight + "px";
});

function changeColor() {
    var selectElement = document.getElementById("hobby");
    var selectedOption = selectElement.options[selectElement.selectedIndex];
    
    if (selectedOption.value !== "") {
        selectedOption.classList.add("red-text");
    } else {
        for (var i = 1; i < selectElement.options.length; i++) {
            selectElement.options[i].classList.remove("red-text");
        }
    }
}

这样，背景颜色会随着网页大小改变，并且头像位于姓名上方。请确保头像图片存在并正确设置路径。同样，请将JavaScript代码保存在名为main.js的文件中。

希望这次修改满足了您的要求！如有其他问题，请随时提问。

内容由零声教学AI助手提供，问题来源于学员提问