用大一html知识,新建一个个人介绍的html源代码模板,要求精简,需要一个主网页和一到两个主网页,用到div+css样式
时间: 2024-03-19 14:46:07 浏览: 13
好的,这是一个简单的个人介绍的html源代码模板,包括一个主页和一个关于页,使用了div和css样式。
主页代码:
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>个人主页</title>
<style>
.container {
width: 80%;
margin: 0 auto;
text-align: center;
padding: 50px 0;
}
h1 {
font-size: 48px;
margin-bottom: 20px;
}
.about-btn {
display: inline-block;
padding: 10px 20px;
background-color: #333;
color: #fff;
text-decoration: none;
border-radius: 5px;
margin-top: 20px;
}
</style>
</head>
<body>
<div class="container">
<h1>欢迎来到我的个人主页</h1>
<p>我是一名大一的学生,喜欢编程和设计。</p>
<a href="about.html" class="about-btn">了解更多</a>
</div>
</body>
</html>
```
关于页代码:
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>关于我</title>
<style>
.container {
width: 80%;
margin: 0 auto;
text-align: center;
padding: 50px 0;
}
h1 {
font-size: 48px;
margin-bottom: 20px;
}
p {
font-size: 24px;
line-height: 1.5;
margin-bottom: 20px;
}
</style>
</head>
<body>
<div class="container">
<h1>关于我</h1>
<p>我是一名大一的学生,喜欢编程和设计。</p>
<p>我喜欢学习新技术,也喜欢与人分享我的知识。</p>
</div>
</body>
</html>
```
这是一个非常基础的模板,你可以根据自己的需要进行修改和扩展。