前端实习面试常考(定位、文档流)

前端实习面试常考(定位、文档流)

最近在找前端的实习,看了很多面试题,再这里做一个总结分享给大家,希望对大家的实习面试起到一些帮助(本人刚入门不久,如果大家对我的内容有异议,欢迎大家私信,交流一下,共同进步)

对于前端实习面试题这个模块,我大体分为4个部分,HTML&CSS、JavaScript、计算机网络、Vue3(本人框架只学了Vue3)

1、定位

值 描述
static 无定位,left、top、bottom、right不可用
absolute 生成绝对定位元素,相对于static定位以外的第一个父元素进行定位,元素位置可控(left、top、bottom、right有效)
fixed 相对于浏览器窗口生成绝对定位元素,元素位置可控
relative 生成相对定位元素,相对于父级
inherit 继承父元素的position值

扩展:在面试官问定位的时候很可能问到文档流的问题

2、文档流

文档流可以分为,普通流和脱离文档流

普通流:也可称为常规流、文档流。是文档中可显示对象在排列时所占的位置

脱离文档流:元素浮动在文档流之上

以上是定义,以下是理解:

所谓文档流,可以理解为是元素的位置,比如,relative定位的元素就处于文档流。此时,通过left、top、bottom、right四个属性可以规定元素的位置,但元素出现在你所规定的位置之后,它原来的位置依旧保留,其他元素不能占用。而用absolute、fixed定位的元素,就脱离了文档流,也就是说,自己规定了元素的位置之后,元素的原位置不保留了,可以理解为元素发生了一个简单地"平移"。注意,浮动元素也会脱离文档流,请看我的另一篇关于浮动布局的文章。

相关推荐
Frag0ut1 小时前
Notepad++ 零基础入门:从记事本到代码编辑器的平滑过渡(2026最新版)
python·编辑器·html·json·notepad++·markdown·记事本
用户298698530142 小时前
Python 实现 HTML 转纯文本:两种场景下的文档模型方案
python·html·api
java1234_小锋2 小时前
【技术专题】CSS3 网页技术 - CSS3 视觉增强
前端·css·css3
晓得迷路了3 小时前
栗子前端技术周刊第 152 期 - Rspack 2.3、TypeScript 7.1 Beta、Bun 1.4.4...
前端·javascript·css
普通人64 小时前
CSS-box-sizing-使用指南
开发语言·前端·css·1024程序员节
前端架构师-老李4 小时前
HTML与CSS基础第七课—HTML 中的a标签(跳转链接)
前端·css·html
溪语流沙1 天前
【每天一个CSS | Day41】开关三连:一套状态机,三种视觉翻译
前端·css·html5·每日一练·按钮
变与不变8061 天前
css定位布局精讲
前端·css
zhippt_10141 天前
教师做课件太耗时?AI生成PPT工具与图转PPT实测梳理
人工智能·html·powerpoint
winfredzhang1 天前
从零手写一个毛玻璃风格的页面搭建台:单文件 HTML 实现组件放置、面板磁吸与图层管理
前端·html