overflow

使用position: fixed实现居中弹窗，结合top: 50%、left: 50%和transform: translate(-50%, -50%)可精准居中，适用于模态框等场景；对于下拉菜单或提示框，常将父容器设为relative，弹窗使用absolute定位以相对触发元素精确定位；遮罩层通…

calc()函数可混合单位动态计算宽高，配合box-sizing: border-box更易控制尺寸。1. 默认content-box下width仅含内容，加padding/border会增加总尺寸；2. 推荐border-box使width包含content+padding+border；3. 常…

元素实际宽高由content、padding、border组成，margin仅影响布局间距；默认box-sizing: content-box下，总宽度=width+左右padding+左右border+左右margin；设置box-sizing: border-box后，width已包含paddi…

清除多个浮动元素的关键是让父容器正确包裹子元素并防止后续内容受影响。1. 使用 clear 属性，通过添加空元素并设置 clear: both 来隔离浮动；2. 推荐使用伪元素 ::after 添加 content 并应用 clear: both，实现无额外 DOM 的清除效果；3. 为父容器设置 …

使用CSS float可实现兼容性好的图片画廊布局。通过设置.gallery-item宽度为33.3%并应用float:left，形成三列布局，配合overflow:hidden清除浮动，避免父容器塌陷；结合媒体查询在768px和480px断点下调整为两列和单列，实现响应式效果，同时使用box-si…

合理设置CSS过渡可提升弹性与网格布局中卡片交互的流畅性，通过定义transform等GPU加速属性、预留空间防抖动及使用transition-delay实现自然动态效果。 在弹性网格卡片布局中，CSS 过渡（transition）能让用户交互更自然，比如鼠标悬停时的放大、颜色变化或阴影浮现。合理使…

CSS transition在flex布局中可正常生效，关键在于选择可过渡属性。1. flex-grow、flex-shrink、flex-basis、width、height、margin、opacity、transform等属性均支持过渡，可通过hover或类切换触发平滑动画。2. 使用flex…

异常是Java中用于处理运行时错误的机制，通过Throwable类及其子类Error、Exception实现；其中Exception分为编译器强制处理的受检异常（如IOException）和无需强制处理的非受检异常（如NullPointerException）；通过try-catch-finally…

定位元素的布局受父元素影响，关键在于包含块和已定位祖先。1. 包含块由最近的已定位（relative、absolute、fixed、sticky）祖先决定，若无则相对根元素。2. 父元素设为relative可作为子元素定位参考，不脱离文档流。3. absolute元素脱离文档流，相对于最近的非sta…

合理设置margin可优化浮动布局间距。通过统一方向添加margin并用:last-child或:not()清除末项，避免错位；父容器使用负margin抵消子元素外边距实现内收效果；为防止垂直margin合并，应单侧控制间距，或改用padding、flex+gap替代，提升布局可控性。 在使用 CS…