Bootstrap中sm断点在旧版为768px,实为历史适配惯性;Bootstrap 5已改为576px,且col-类从0px起效,最小宽度由开发者自定义媒体查询或版本决定。Bootstrap默认断点中,sm起始宽度是768px,但这是历史版本遗留值Bootstrap 4 和更早版本把 sm 断点设为 min-width: 768px,所以很多人误以为"Bootstrap最小宽度就是768px"。实际上,这既不是框架的"最小限制",也不是现代标准------它只是当时平板设备(如iPad)的常见分界线。真正决定"最小宽度"的,是你自己写的媒体查询或所用的Bootstrap版本。比如:Bootstrap 5 完全弃用了 xs 前缀,col-(无前缀)默认就在 0px 生效,也就是从最窄屏幕开始响应sm 在 Bootstrap 5 中对应 min-width: 576px,不是768px如果你没引入任何CSS、也没写媒体查询,那根本不存在"最小宽度限制"------浏览器按自然流式渲染为什么老项目里总看到768px?这不是Bug,是适配惯性2012年前后iPad分辨率普遍为768×1024,开发者把横向临界值定在768px,既能区分手机和iPad,又避开iPhone横屏(通常现在再硬套768px,反而容易出问题:很多安卓平板竖屏宽度已超800px,但UI仍被归入sm样式,导致布局撑开或错位折叠屏手机(如Pixel Fold)展开后宽度达1000px+,却可能因旧断点逻辑被当成"桌面端",丢失触控优化你自定义的@media (min-width: 768px)若没加max-width,会持续生效到4K屏,图标/文字可能越变越大怎么查自己项目实际生效的最小宽度?别猜,直接看计算后的样式。打开Chrome DevTools → Elements → 选中目标元素 → 右侧Styles面板,展开Styles或Computed,搜索width或@media,观察哪条规则在当前视口宽度下被激活。更准的做法是临时加一段调试代码: Mokker AI AI产品图添加背景
相关推荐
大海变好AI16 小时前
AI 工作流怎么搭建提升效率叫我:松哥16 小时前
基于flask图书管理系统,技术栈flask+layui+sqlite+Echarts落魄大学生之流水线上谋生计16 小时前
Python Literal[] 类型提示详解nanawinona16 小时前
2026年下半年按能力基础选量化工具赵民勇17 小时前
Python泛型使用技巧裕晟资质规划17 小时前
首次办理军工保密资质:咨询服务选择要点与全流程交付清单(评估框架)jyOverQ17 小时前
LangGraph:子图动态路由与 Agent 工作流设计晴天1617 小时前
Gradio 与 Streamlit:Python 快速构建 Web 应用的双子星-Day28苏灿烤鱼17 小时前
把求职写成工作流,公开 fork 为什么会把简历写进仓库?whcyhhh17 小时前
头歌实践教学平台:数据科学与大数据技术导论(十)