CSS学习笔记(浮动float)(1)

标准流实际上就是一个网页内标签元素正常从上到下,从左到右排列顺序的意思。比如块级元素会独占一行,行内元素会按顺序依次前后排列;按照这种大前提的布局排列之下绝对不会出现例外的情况叫做普通流布局。

二、浮动(float)

  • 浮动最早是用来控制图片的,以便达到其他元素(特别是文字)实现 “环绕”图片的效果。

  • 现在我们主要使用浮动来让块级元素并排显示

1、浮动是什么

元素的浮动是指设置了浮动属性的元素会脱离标准普通流的控制,移动到其父元素中指定位置的过程。

选择器 {float:属性值;} //left 、right 、none

2、浮动的特性

  • 浮动脱离标准流

  • 不占位置

  • 会影响标准流

  • 浮动只有左右浮动

a、浮动的元素总是找理它最近的父级元素对齐。但是不会超出内边距的范围。

在这里插入图片描述

b、浮动的元素排列位置,跟上一个元素(块级)有关系。如果上一个元素有浮动,则A元素顶部会和上一个元素的顶部对齐;如果上一个元素是标准流,则A元素的顶部会和上一个元素的底部对齐。

在这里插入图片描述

(1)一个父盒子里面的子盒子,如果其中一个子级有浮动的,则其他子级都需要浮动。这样才能一行对齐显示。

(2)元素添加浮动后,元素会具有行内块元素的特性。元素的大小完全取决于定义的大小或者默认的内容多少浮动根据元素书写的位置来显示相应的浮动。

(3)一个元素内部所有元素都浮动了,如果父元素在没有设置高度的情况下它的高度会变成0,也就是说父元素的高度塌陷了。

前端框架

前端框架太多了,真的学不动了,别慌,其实对于前端的三大马车,Angular、React、Vue 只要把其中一种框架学明白,底层原理实现,其他两个学起来不会很吃力,这也取决于你以后就职的公司要求你会哪一个框架了,当然,会的越多越好,但是往往每个人的时间是有限的,对于自学的学生,或者即将面试找工作的人,当然要选择一门框架深挖原理。

以 Vue 为例,我整理了如下的面试题。

Vue部分截图

开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值