以下是一个简单的网页,包含一些基本的HTML、CSS和JavaScript代码,你可以参考一下:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>My Website</title>
<style>
/* CSS样式 */
body {
background-color: #f7f7f7;
font-family: Arial, sans-serif;
}
h1 {
color: #333;
text-align: center;
margin-top: 50px;
}
p {
font-size: 1.2em;
line-height: 1.5em;
margin: 20px;
}
#btn {
display: block;
width: 100px;
height: 40px;
margin: 20px auto;
background-color: #e67e22;
color: #fff;
font-size: 1.2em;
border: none;
border-radius: 5px;
cursor: pointer;
}
</style>
</head>
<body>
<h1>Welcome to My Website</h1>
<p>This is a simple website created using HTML, CSS and JavaScript.</p>
<p>Click the button below to change the background color:</p>
<button id="btn">Change Color</button>
<script>
// JavaScript代码
var body = document.querySelector('body');
var btn = document.querySelector('#btn');
btn.addEventListener('click', function() {
body.style.backgroundColor = getRandomColor();
});
function getRandomColor() {
var letters = '0123456789ABCDEF';
var color = '#';
for (var i = 0; i < 6; i++) {
color += letters[Math.floor(Math.random() * 16)];
}
return color;
}
</script>
</body>
</html>
这个网页包含一个标题、两个段落和一个按钮,点击按钮可以随机改变网页的背景颜色。