响应式网页设计是一种网页设计方法，使网站能够在各种设备上都能良好显示。
响应式设计的三大要素
- 流体网格（Fluid Grids）
- 弹性图片（Flexible Images）
- 媒体查询（Media Queries）
/* 小屏幕设备（手机，768px 及以下） */
@media (max-width: 768px) {
.container {
padding: 10px;
}
.sidebar {
display: none;
}
}
/* 中等屏幕设备（平板，769px 到 992px） */
@media (min-width: 769px) and (max-width: 992px) {
.container {
max-width: 750px;
}
}
/* 大屏幕设备（桌面，993px 及以上） */
@media (min-width: 993px) {
.container {
max-width: 1200px;
}
}
提示： 这是一个重要的概念，需要特别注意理解和掌握。
注意： 这是一个常见的错误点，请避免犯同样的错误。
评论
请 登录 后发表评论