【CSS学习第十三篇】

CSS学习第十三篇

  • [1. 移动端常见布局---响应式布局导读](#1. 移动端常见布局—响应式布局导读)
  • [2. 响应式开发原理](#2. 响应式开发原理)
  • [3. 响应式布局容器](#3. 响应式布局容器)
  • [4. 响应式导航案例](#4. 响应式导航案例)

1. 移动端常见布局---响应式布局导读

响应式:页面内的布局会随着屏幕的大小变化而发生响应,做出不同的布局。所以,

响应式布局不需要单独写移动端页面,

是响应不同的设备来发生变化的,包括pc端、pad端、移动端。
目标:(本节只介绍前两个)

目录:本节只学第一个

2. 响应式开发原理

媒体查询:可以检测到不同的宽度。

3. 响应式布局容器

一个页面的页面元素很多,

如果要通过媒体查询来控制每一个页面的大小变化,

是比较困难的:

所以,在响应式里面,提出了这样的一种策略:布局容器

但是我们也可以根据实际情况自己定义划分。
实操:

4. 响应式导航案例

我们来做一个响应式导航的案例。
实操:

相关推荐
艾莉丝努力练剑3 分钟前
【MYSQL】MYSQL学习的一大重点:基本查询(下)
android·数据库·学习·mysql·面试·八股文
晓梦林10 分钟前
[极客大挑战 2019]Secret File学习笔记
笔记·学习
程序员爱钓鱼11 分钟前
Rust Result 详解:可靠的错误处理机制
前端·后端·rust
鱼樱前端19 分钟前
别再"学工具"了,先搭你的 AI 工作流
前端·ai编程·前端工程化
STLearner1 小时前
ICML 2026 | LLM×Graph论文总结[2]【Graph4LLM,Graph4Agent,智能体记忆(Memory)
大数据·人工智能·python·深度学习·学习·机器学习·数据挖掘
凤山老林2 小时前
从美团全栈化看 AI 冲击:前端转全栈,是自救还是必然
前端·人工智能·状态模式
其实防守也摸鱼2 小时前
KMP全栈开发:从Android到AI Agent的技术演进与实践
android·运维·网络·人工智能·学习·安全·macos
YM52e7 小时前
鸿蒙Flutter Padding内边距:EdgeInsets详解
android·学习·flutter·华为·harmonyos·鸿蒙
西安老张(AIGC&ComfyUI)9 小时前
第034章:ComfyUI&AIGC一阶段学习总结及下阶段学习安排
学习·aigc
777VG9 小时前
PostgreSQL +martin将多张表输出成一个 MVT
前端·数据库·postgresql