个人简介网站示例
Just a moment…
HTML结构
<!DOCTYPE html>
<html lang="zh">
<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>
<div class="main-content">
<h2>个人简介</h2>
<!-- 这里可以添加更多的内容 -->
</div>
</body>
</html>
CSS样式表(styles.css)
* {
box-sizing: border-box;
margin: 0;
padding: 0;
}
html {
line-height: 1.15;
-webkit-text-size-adjust: 100%;
color: #313131;
font-family: system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;
}
body {
display: flex;
flex-direction: column;
height: 100vh;
min-height: 100vh;
}
.main-content {
margin: 8rem auto;
max-width: 60rem;
padding-left: 1.5rem;
}
@media (width <= 720px) {
.main-content {
margin-top: 4rem;
}
}
.h2 {
/* 这里可以添加标题的样式 */
}
