网站简介
这是一个简单的网站模板,使用HTML和CSS编写。网站的布局采用了响应式设计,可以适应不同设备的屏幕尺寸。整个网站的宽度和高度都是100%,这意味着它将占据浏览器窗口的所有可用空间。此外,还设置了外边距和内边距为0,以实现整洁的外观。
HTML结构
这个网站的HTML结构非常简单,主要包括一个<html>
标签、一个<head>
标签和一个<body>
标签。在<head>
标签中,我们定义了网站的标题、字符编码以及引入了一些外部样式表。在<body>
标签中,我们包含了一些基本的内容元素,如标题、段落和图片等。
<!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>
<!-- 在这里添加网站的内容 -->
</body>
</html>
CSS样式
为了实现响应式布局,我们需要使用CSS来设定<body>
标签的样式。在这个例子中,我们将宽度和高度设置为100%,并移除了外边距和内边距。此外,我们还设置了字体、颜色、背景色等基本样式。
html, body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}
/* 其他样式 */
通过这种方式,我们可以轻松地为不同的设备和屏幕尺寸创建适配性强的网站。