以下是一个义工网站模板的示例,您可以根据需要进行修改:
HTML结构:
```
义工网站 这里是义工网站的内容
欢迎来到我们的义工网站,我们提供各种服务,帮助有需要的人。
如果您需要帮助,请随时联系我们的客服中心。
谢谢!
```
CSS样式:
```
body {
background-color: #f2f2f2;
font-family: Arial, sans-serif;
}
nav {
background-color: #fff;
padding: 20px;
border-radius: 10px;
box-shadow: 0 0 10px rgba(0,0,0,0.2);
}
ul {
list-style: none;
margin: 0;
padding: 0;
}
li {
display: inline-block;
margin-right: 10px;
}
img {
width: 100%;
height: auto;
}
button {
background-color: #4CAF50;
color: #fff;
padding: 10px 20px;
border: none;
border-radius: 5px;
cursor: pointer;
}
nav > li {
display: block;
margin-right: 0;
}
nav > ul {
display: none;
}
nav > li > li {
display: inline-block;
margin-right: 10px;
}
nav > li > img {
width: 100%;
height: auto;
}
nav > li > button {
background-color: #4CAF50;
color: #fff;
padding: 10px 20px;
border: none;
border-radius: 5px;
cursor: pointer;
}
```