html+css
web-chubby
前端使我快乐!!!
展开
-
最详细-BFC块级格式化上下文
什么为 BFC BFC(Block Formatting Contexts ) 就是即块级格式化上下文。是Web页面中盒模型布局的CSS渲染模式,指一个独立的渲染区域或者说是一个隔离的独立容器。 BFC的特性 我们大家都知道bfc的特性: 1.内部的元素会在垂直方向,从顶部开始一个接一个地放置。 2.元素垂直方向的距离由margin决定。属于同一个BFC的两个相邻 元素的margin会发生叠加 3.都是从最左边开始的。每个元素的margin box的左边,与包含块border box的左边(对于.原创 2020-07-30 11:47:49 · 258 阅读 · 0 评论 -
高度塌陷最常用方法
高度塌陷 父元素不写高度时,子元素写了浮动后,父元素会发生高度塌陷(造成父元素高度为 0) 可以看到给子元素添加浮动后,父元素的高度变为了0 下面就来详细说一下怎么解决高度塌陷问题,这里只为大家总结几种最常用的方法 1、给父元素添加声明overflow:hidden 优点:代码少、简单 缺点:1、只适用于高版本游览器,IE6不支持。 2、不能和position定位配合使用,超出的尺寸会被隐藏 <style type="text/css"> .box{ margin: 200px auto原创 2020-07-22 17:05:49 · 112 阅读 · 0 评论 -
盒子居中常用方法
大家都知道,不管是在平常布局中还是在面试当中都会遇到让一个盒子水平且垂直居中的情况,在这里总结了几种常用的居中方法: 1、绝对定位居中(最常用、好用) 2、负margin居中(传统方法) 3、margin固定宽高居中 4、flex居中 5、transform居中 6、table-cell居中 7、不确定宽高居中(绝对定位百分数) 以下例子中使用的基础结构如下 <div class="box"> <div class="chl_box"> </div> <原创 2020-07-22 16:48:59 · 4495 阅读 · 1 评论