郴州网站策划,为什么一个网站做中英文双语版,宝塔面板配置wordpress,网站维护明细报价表1、BFC#xff1a;又叫块级格式化上下文#xff08;block formatting context#xff09;#xff0c;就是页面上一个隔离的独立容器#xff0c;容器里面的子元素不会影响到外面的元素。
2、BFC的原则#xff1a;如果一个元素具有BFC#xff0c;那么内部元素再怎么弄又叫块级格式化上下文block formatting context就是页面上一个隔离的独立容器容器里面的子元素不会影响到外面的元素。
2、BFC的原则如果一个元素具有BFC那么内部元素再怎么弄都不会影响到外面的元素。
3、如何触发BFC float的值为非none overflow的值非visible display的值为inline-block、table、table-cell 等等 position的值为absolute、fixed 高度塌陷
!DOCTYPE html
html langen
headmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0titleBFC/titlestyle* {margin: 0;padding: 0;}ul {list-style: none;border: 10px solid #ccc;}ul li {float: left;margin: 10px;width: 100px;height: 100px;background-color: pink;}/style
/head
bodyulli111/lili222/lili333/li/ulp这是P元素/p
/body
/html 可以通过触发BFC解决问题overflow: hidden;或者position: absolute;或者float: left;
一般是用 overflow: hidden;
* {margin: 0;padding: 0;}ul {list-style: none;border: 10px solid #ccc;overflow: hidden;}ul li {float: left;margin: 10px;width: 100px;height: 100px;background-color: pink;}
