# HTML静态网页代码模板
HTML,全称HyperText Markup Language,是创建网页的基础语言,它就像网页的“骨架”,帮助构建网页的基本结构,以下是一个简单的HTML静态网页代码模板:
<!DOCTYPE html> <html> <head> <title>页面标题</title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- 这里可以添加一些CSS样式 --> <style> body { font-family: Arial, sans-serif; margin: 0; padding: 0; } header { background-color: #f8f9fa; padding: 20px; text-align: center; } main { margin: 20px; padding: 20px; background-color: #fff; border: 1px solid #ccc; border-radius: 5px; } footer { background-color: #f8f9fa; padding: 20px; text-align: center; position: fixed; bottom: 0; width: 100%; } </style> </head> <body> <header> <h1>这是标题</h1> </header> <main> <p>这是主要内容。这是一段示例文本,用于演示HTML静态网页代码模板。</p> <p>你可以在这里添加更多的内容,如列表、表格、图片等。</p> </main> <footer> <p>这是页脚。</p> </footer> </body> </html>
这个模板包括了HTML的基本元素:`` 声明告诉浏览器这是一个HTML5文档,`` 是整个网页的根元素,`` 里包含了一些元数据,比如字符集、视口设置和CSS样式链接,而 `body>` 则包含了网页的所有内容,如标题、正文和页脚等。、``、``等),图片 (``),甚至是链接 (``),`` 是页面的页脚部分。
我们还添加了一些基础的CSS样式来美化这个模板,我们为 `body`、`header`、`main` 和 `footer` 设置了背景颜色、文本对齐方式、边距和内边距等,你可以根据自己的需求修改这些样式。