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

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

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

对于前端实习面试题这个模块,我大体分为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定位的元素,就脱离了文档流,也就是说,自己规定了元素的位置之后,元素的原位置不保留了,可以理解为元素发生了一个简单地"平移"。注意,浮动元素也会脱离文档流,请看我的另一篇关于浮动布局的文章。

相关推荐
Want5951 天前
HTML音乐圣诞树
前端·html
程序员小寒1 天前
前端高频面试题之CSS篇(一)
前端·css·面试·css3
我命由我123451 天前
微信开发者工具 - 模拟器分离窗口与关闭分离窗口
前端·javascript·学习·微信小程序·前端框架·html·js
我有一棵树1 天前
file 协议与 http 协议的区别:为什么本地 HTML 无法加载相对路径 JS,以及正确的解决方式
javascript·http·html
华仔啊1 天前
图片标签用 img 还是 picture?很多人彻底弄混了!
前端·html
合作小小程序员小小店2 天前
网页开发,在线%新版本旅游管理%系统,基于eclipse,html,css,jquery,servlet,jsp,mysql数据库
java·数据库·eclipse·html·intellij-idea·旅游·jsp
风止何安啊2 天前
收到字节的短信:Trae SOLO上线了?尝尝鲜,浅浅做个音乐播放器
前端·html·trae
fruge2 天前
低版本浏览器兼容方案:IE11 适配 ES6 语法与 CSS 新特性
前端·css·es6
今日无bug2 天前
🥁 用 HTML5 打造你的第一个“敲击乐” Web 应用
html
李@十一₂⁰2 天前
HTML 特殊字体符号
前端·html