html简单网页设计作业
时间: 2023-06-26 10:05:21 浏览: 44
好的,以下是一个简单的 HTML 网页设计作业:
```html
<!DOCTYPE html>
<html>
<head>
<title>我的网页</title>
<meta charset="UTF-8">
<style>
body {
background-color: #f2f2f2;
font-family: Arial, sans-serif;
}
h1 {
color: #333;
text-align: center;
}
p {
font-size: 18px;
line-height: 1.5;
}
ul {
list-style-type: none;
margin: 0;
padding: 0;
}
li {
margin-bottom: 10px;
padding-left: 20px;
background-image: url('bullet.png');
background-repeat: no-repeat;
background-position: left center;
}
a {
color: #0077cc;
text-decoration: none;
}
</style>
</head>
<body>
<header>
<h1>欢迎来到我的网页</h1>
</header>
<nav>
<ul>
<li><a href="#">首页</a></li>
<li><a href="#">关于我</a></li>
<li><a href="#">联系我</a></li>
</ul>
</nav>
<main>
<section>
<h2>最新文章</h2>
<ul>
<li><a href="#">文章标题1</a></li>
<li><a href="#">文章标题2</a></li>
<li><a href="#">文章标题3</a></li>
</ul>
</section>
<section>
<h2>关于我</h2>
<p>我是一名前端工程师,喜欢编写网页和网站。我在业余时间也喜欢写博客,记录自己的学习和生活。</p>
</section>
</main>
<footer>
<p>© 2021 我的网页</p>
</footer>
</body>
</html>
```
这个网页包含了一个标题、导航栏、两个内容区域和一个页脚。其中使用了 CSS 样式来设置字体、颜色、背景图片等等。你可以根据自己的需求,修改这个网页的内容和样式,让它更符合你的要求。