文章分类 -  布局

摘要：浮动溢出的定义： 非IE浏览器下，容器不设高度且子元素浮动时，容器高度不能被内容撑开。 此时，内容会溢出到容器外面而影响布局。这种现象被称为浮动（溢出）。 浮动的工作原理： 浮动元素脱离文档流，不占据空间（引起“高度塌陷”现象） 浮动元素碰到包含它的边框或者其他浮动元素的边框停留 浮动元素可以左右移 阅读全文

摘要：Flex是FlexibleBox的缩写，意为"弹性布局" 以下6个属性设置在容器上： flex-direction属性决定主轴的方向（即项目的排列方向）。 flex-wrap属性定义，如果一条轴线排不下，如何换行。 flex-flow属性是flex-direction属性和flex-wrap属性的简 阅读全文

摘要：利用绝对定位，先将元素的左上角通过top:50%和left:50%定位到页面的中心，然后再通过translate来调整元素的中心点到页面的中心。该方法需要考虑浏览器兼容问题。 利用绝对定位，设置四个方向的值都为0，并将margin设置为auto，由于宽高固定，因此对应方向实现平分，可以实现水平和垂直 阅读全文