设计一个网页作为期末作业是一个很好的机会来展示你的前端开发技能。以下是一些步骤和建议,帮助你完成这个项目:
以下是一个简单的HTML和CSS示例,用于创建一个基本的网页结构:
DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>我的网页title>
<link rel="stylesheet" href="styles.css">
head>
<body>
<header>
<h1>欢迎来到我的网页h1>
<nav>
<ul>
<li><a href="#about">关于我们a>li>
<li><a href="#services">服务a>li>
<li><a href="#contact">联系方式a>li>
ul>
nav>
header>
<main>
<section id="about">
<h2>关于我们h2>
<p>这里是关于我们的介绍...p>
section>
<section id="services">
<h2>我们的服务h2>
<p>这里是我们提供的服务...p>
section>
<section id="contact">
<h2>联系方式h2>
<p>这里是联系我们的方式...p>
section>
main>
<footer>
<p>版权所有 © 2024p>
footer>
body>
html>
/* styles.css */
body {
font-family: Arial, sans-serif;
line-height: 1.6;
}
header, nav, main, footer {
padding: 20px;
text-align: center;
}
nav ul {
list-style: none;
padding: 0;
}
nav ul li {
display: inline;
margin-right: 10px;
}
nav ul li a {
text-decoration: none;
color: #333;
}
section {
margin-bottom: 20px;
}
footer {
background-color: #f4f4f4;
color: #333;
}
这只是一个起点,你可以根据需要添加更多的样式和功能。如果你需要更具体的帮助,比如关于某个特定功能的实现,请随时提问。