个人网站介绍 这是一个用于展示个人信息和作品集的个人网站。该网站采用了简洁、清晰的设计风格,使得用户能够快速地了解作者的背景和专业领域。

HTML结构

<body>
<div class="tip">
<div class="tip-con">
<h3>欢迎来到我的个人网站</h3>
<p>这里是我的简介和作品集,欢迎浏览。</p>
</div>
</div>
</body>

CSS样式

通过设置CSS样式,可以对网站的整体外观进行美化。以下是一些关键样式:

  • padding: 0; margin: 0;:去除元素之间的内边距和外边距。
  • body{font...}:设置页面中使用的字体以及字体相关的属性,如抗锯齿效果和字体换行。
  • .tip{text-align: center; display: table; width: 100%; height: 100%; position: absolute; top: 0; left:0; right: 0; bottom: 0}:将提示框居中显示在屏幕上,并填充整个页面。
  • .tip-con{display: table-cell; vertical-align: middle}:将提示内容垂直居中显示在提示框单元格中。
  • .tip h3{font-size: 26px; margin-bottom: 14px; font-weight: normal}:设置提示框标题的字体大小、底部间距和字重。
  • .tip p{font-size: 14px}:设置提示框正文的字体大小。

总结

这个个人网站使用了简单的HTML结构和基本的CSS样式,提供了一个简洁而美观的页面布局。你可以根据需要进一步定制和完善网站的内容和样式,以满足自己的需求。