【说站】css中BFC布局规则是什么
2023-06-13 09:13:16 时间
css中BFC布局规则是什么
说明
1、BFC是页面上隔离的独立容器,容器中的子元素不会影响外部元素。反之亦然。
这一元素的垂直方向边距将重叠,垂直方向的距离由margin决定,取值。
2、BFC区域不会与浮动盒重叠(去除浮动原理)。
3、浮动元素在计算BFC高度时也参与计算。
实例
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Document</title>
<style type="text/css">
.div1 {
background-color: #ef6f6f;
width: 200px;
height: 100px;
}
.div2 {
background-color: #fff086;
width: 200px;
height: 100px;
}
</style>
</head>
<body>
<div>div1</div>
<div>div2</div>
</body>
</html>
以上就是css中BFC布局规则的介绍,希望对大家有所帮助。更多css学习指路:css教程
本文教程操作环境:windows7系统、css3版,DELL G3电脑。
收藏 | 0点赞 | 0打赏
相关文章
- SQL审核 | SQLE OceanBase for MySQL 新增了部分审核规则
- Nature子刊 | 像婴儿一样学习,DeepMind新模型28小时学会物理世界规则
- css opacity属性_CSS中的opacity属性[通俗易懂]
- CSS @media 规则
- CSS媒体查询_css网页
- 信息泄露渠道及风险感知;数据脱敏规则探讨 | FB甲方群话题讨论
- 【CSS教程】紫色渐变登陆布局html+css代码
- Drools 规则引擎—-向领域驱动进步(一)详解编程语言
- MongoDB文档键的命名规则
- 技术如何改变敏捷的规则
- MySQL中的中文排序规则及使用方法(mysql中中文排序规则)
- 58到家MySQL军事规则与现实(58到家mysql军规)
- 掌握Oracle中表命名规则(oracle中的表名规则)
- javascript表单规则集合对象
- PHPhtml标签正则替换并可自定义正则规则
- juqery学习之六CSS--css、位置、宽高
- 如何使用jquery控制CSS样式,并且取消Css样式(如背景色,有实例)
- JavaScript实现动态创建CSS样式规则方案