电话
400 9058 355
News
固定宽度需在flex中设flex-basis并加flex-shrink:0(如flex:00200px),grid中用grid-template-columns配具体长度单位(如200px1fr);混用width与flex属性或忽略收缩控制会导致失效。
z-index仅对已定位元素(position为relative/absolute/fixed/sticky)或Flex项目生效;若元素未显式设置position属性,即使声明了z-index也不会产生层叠效果。本文详解其原理、典型误用场景及正确修复方法。
外层容器用padding、内层元素用margin。这最可控且符合盒模型直觉;反用易致margin合并、塌陷或尺寸模糊,推荐用gap替代margin实现可靠间距。
本文介绍如何仅用CSS将宽度未知且宽于父容器的子元素,在绝对定位的极窄父容器中实现精准水平居中,兼容white-space:nowrap和max-width等常见限制条件。
浮动元素边框不显示是因父容器高度塌陷未包裹浮动子元素;box-sizing仅影响自身宽高计算,无法解决塌陷;有效方案为触发BFC、清除浮动或改用Flex/Grid布局。
浮动元素导致父容器高度塌陷,若父容器设overflow:auto/hidden触发BFC且内部浮动元素实际高度超限,会意外出现滚动条;推荐用clearfix或display:flow-root清除浮动,优先采用Flex/Grid替代浮动布局。
浮动广告导致父容器塌陷时,clear并非万能解药,因其仅对后续非浮动块级元素生效;推荐用display:flow-root或overflow:hidden闭合浮动,语义更清晰且无副作用。
box-shadow被裁剪最常见原因是父容器overflow:hidden或auto,需检查上级容器overflow值并临时改为visible测试;卡片无尺寸、透明背景、语法错误、高DPI屏幕适配不当等也会导致阴影不可见。
邮箱:8955556@qq.com
Q Q:8955556