给我一个标准的html内嵌css+javascript的主页模板
时间: 2023-11-22 14:04:41 浏览: 34
<!DOCTYPE html>
<html>
<head>
<title>My Website</title>
<style>
/* CSS styles go here */
body {
background-color: #f2f2f2;
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
}
header {
background-color: #333;
color: #fff;
padding: 10px;
text-align: center;
}
nav {
background-color: #666;
color: #fff;
padding: 10px;
text-align: center;
}
nav a {
color: #fff;
font-weight: bold;
text-decoration: none;
margin: 0 10px;
}
nav a:hover {
color: #f2f2f2;
}
.container {
margin: 0 auto;
max-width: 960px;
padding: 20px;
}
section {
background-color: #fff;
border: 1px solid #ccc;
margin: 20px 0;
padding: 20px;
}
footer {
background-color: #333;
color: #fff;
padding: 10px;
text-align: center;
}
</style>
</head>
<body>
<header>
<h1>My Website</h1>
</header>
<nav>
<a href="#">Home</a>
<a href="#">About</a>
<a href="#">Contact</a>
</nav>
<div class="container">
<section>
<h2>Welcome to My Website</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vitae commodo libero, sed condimentum velit. Fusce at odio commodo, finibus dolor in, ultrices ante. Sed viverra, massa a commodo finibus, lacus arcu commodo ex, quis mattis nunc diam sit amet augue. Donec condimentum ipsum massa, vel vestibulum nunc malesuada et. Cras consequat magna velit, at blandit elit varius sed. Proin ultrices leo eget quam commodo, in bibendum quam faucibus. Nunc molestie metus a augue maximus, vel vestibulum mauris bibendum.</p>
</section>
<section>
<h2>About Me</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vitae commodo libero, sed condimentum velit. Fusce at odio commodo, finibus dolor in, ultrices ante. Sed viverra, massa a commodo finibus, lacus arcu commodo ex, quis mattis nunc diam sit amet augue. Donec condimentum ipsum massa, vel vestibulum nunc malesuada et. Cras consequat magna velit, at blandit elit varius sed. Proin ultrices leo eget quam commodo, in bibendum quam faucibus. Nunc molestie metus a augue maximus, vel vestibulum mauris bibendum.</p>
</section>
<section>
<h2>Contact Me</h2>
<form>
<label for="name">Name:</label>
<input type="text" id="name" name="name"><br><br>
<label for="email">Email:</label>
<input type="email" id="email" name="email"><br><br>
<label for="message">Message:</label><br>
<textarea id="message" name="message"></textarea><br><br>
<input type="submit" value="Send">
</form>
</section>
</div>
<footer>
<p>© 2021 My Website</p>
</footer>
</body>
</html>