/* 以下是CSS文件中可能包含的代码示例 */
/* 布局样式 */
body {
margin: 0;
padding: 0;
}
.wrapper {
max-width: 1200px;
margin: 0 auto;
}
.header {
height: 80px;
background-color: #333;
color: #fff;
text-align: center;
line-height: 80px;
}
.main {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
margin: 40px 0;
}
/* 文本样式 */
h1 {
font-size: 48px;
color: #333;
margin: 20px 0;
}
p {
font-size: 18px;
line-height: 1.5;
color: #666;
}
/* 链接样式 */
a {
color: #3399cc;
text-decoration: none;
}
a:hover {
color: #006699;
text-decoration: underline;
}
/* 图片样式 */
.image {
max-width: 100%;
height: auto;
margin-bottom: 20px;
}
/* 响应式样式 */
@media screen and (max-width: 768px) {
.main {
flex-direction: column;
align-items: flex-start;
}
.image {
margin-bottom: 0;
}
}
上面代码示例展示了CSS文件中可能包含的样式,可以看到,CSS文件中的样式不仅包括网页的布局,还包括文字、链接、图片等的样式。此外,CSS文件还可以为网页添加响应式样式,使得网页在不同大小的屏幕上都具有良好的显示效果。