BFC块格式

BFC
块格式化上下文
是web页面的可视化css渲染的一部分
是块盒子的布局发生区域,也是浮动元素与其他元素交互的区域.

个人理解:
1.BFC是一个独立的布局环境,BFC内部元素布局与外部元素互不影响.
2.可以通过一些条件触发BFC,从而实现布局上的需求和解决一些问题.
3.可以把BFC理解成一个工具,无需纠结其中的含义,只需了解它的特性即可.

触发条件:
1.根目录
2.float 的值非none
3.overflow的值非visible
4.display的值是inline-block,table-cell,table-caption,fiex,inline-fiex.
5.position的值是fixed,absolute.

BFC特性
1.属于同一个BFC的两个相邻容器的上下margin会重叠
2.计算BFC高度时浮动元素也会参与计算
3.BFC的容器不会与浮动容器发生重叠
4.BFC内的容器在垂直方向上依次排列
5.元素的margin-left与其包含的边框相接触.
6.BFC是独立容器,容器内部元素不会影响容器外部元素.

overflow: hidden; 溢出部分:隐藏;

url从输入到页面展示的过程
1.输入url地址,发送http请求
2.浏览器会根据url地址查看缓存, 顺序:浏览器缓存>系统缓存>路由缓存,如果都没有,继续向下执行.
3.根据http网址去解析服务器IP,端口号.
4.根据IP和端口号和web服务器建立连接
5.浏览器向服务器发送请求.
6.服务器接收到了请求,会向浏览器返回响应.
7.关闭连接,解析文件,浏览器将内容渲染到页面.

浏览器渲染页面的过程
1.解析html
2.构建DOM树 html(标签)
3.构建渲染树 css
4.绘制渲染树

重绘 和 重排(回流)
重排一定会引起重绘,但是重绘不一定引起重排

重排:当DOM的变化影响几何属性(宽高),浏览器需要重新计算元素的几何属性,其他元素的几何属性可能会受到影响,发生改变,这个时候浏览器会重新构建渲染树.这个过程叫做重排.
重绘:重新绘制页面

iframe框架
引入页面

src 路径
frameborder 边框 值:0或者1
scrolling 滚动条 值:yes no auto
marginheight 框架内顶部与底部边距
marginwidth 框架内左侧与右侧边距

项目分工:
1.竞标 - 市场 售前
2.需求调研 - 售前 项目经理
3.成立项目组
4.制作平面图(psd) - UI设计 美工
5.制作网页 - 前端
6.设计-架构师 - 写数据库当中各种表
7.后台—程序员
C++ php Java python .net
8.测试 - 测试人员
黑盒 白盒
9.产品上线 - 实施 测试 项目经理
10.维护 - 维护人员

一个美工 一个前端 三个后台 一个测试

一个美工 三个前端 五个后台 2个测试

切图:
场景1:不需要关闭图层
1.图层----->合并可见图层
2.用选框工具框选出要保存的区域
3.Ctrl+C 复制区域
Ctrl+n 新建 (查看大小是否一致,调整背景为透明)
Ctrl+v 粘贴
4.文件 – 存储为web所用格式
5.改预设(尾缀):透明图片尾缀:png 非透明尾缀:jpg 和 png 均可.
6.选择文件夹 ----> 改文件名
(不能出现中文,特殊符号,空格)

场景2:需要关闭图层
1.选择移动工具
2.点击不要的区域
3.关闭被选中的图层(直到出现网格为止)
重复场景1

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值