提醒:本文最后更新于 2026-05-24 06:21,文中所关联的信息可能已发生改变,请知悉!
web 前端是一个新词汇,随着信息技术的发展,衍生出各类相关职业,如前端美工、web 前端工程师等,对于其面试过程中常见的面试问题,以下将对其进行介绍。
编辑
一、职位划分
1. 网页制作
2. 前端制作工程师
3. 网站重构工程师
4. 前端开发工程师
5. 资深前端开发工程师
二、常见面试题及答案
1.HTML&CSS 部分
1)常用那几种浏览器测试?有哪些内核 (Layout Engine)?
答案:(Q1) 浏览器:IE,Chrome,FireFox,Safari,Opera。
(Q2) 内核:Trident,Gecko,Presto,Webkit。
2)行内元素和块级元素的区别?行内块元素的兼容性使用?
答案:(IE8 以下)行内元素:会在水平方向排列,不能包含块级元素,设置 width 无效,height 无效 (可以设置 line-height),margin 上下无效,padding 上下无效。
块级元素:各占据一行,垂直方向排列。从新行开始结束接着一个断行。兼容性:display:inline-block;display:inline;zoom:1;
3)box-sizing 常用的属性有哪些?分别有什么作用?
答案:常用的属性:box-sizing: content-box border-box inherit;
作用:content-box: 宽度和高度分别应用到元素的内容框。在宽度和高度之外绘制元素的内边距和边框 (元素默认效果)。border-box: 元素指定的任何内边距和边框都将在已设定的宽度和高度内进行绘制。通过从已设定的宽度和高度分别减去边框和内边距才能得到内容的宽度和高度。
4)简述对 HTML 语义化的理解?
答案:用正确的标签做正确的事情。
①html 语义化让页面的内容结构化,结构更清晰,便于对浏览器、搜索引擎解析;
②即使在没有样式 CSS 情况下也以一种文档格式显示,并且是容易阅读的; 搜索引擎的爬虫也依赖于 HTML 标记来确定上下文和各个关键字的权重,利于 SEO;
③使阅读源代码的人对网站更容易将网站分块,便于阅读维护理解。
5)介绍一下 CSS 的盒子模型?
答案:①有两种,IE 盒子模型、标准 W3C 盒子模型;IE 的 content 部分包含了 border 和 pading;
②盒模型:内容 (content)、填充 (padding)、边界 (margin)、边框 (border)。
6)如何居中 div?如何居中一个浮动元素?
答案:①水平居中:给 div 设置一个宽度,然后添加 margin:0 auto 属性 div{width:200px; margin:0 auto;}
②垂直居中:确定容器的宽高:如宽 500 高 300 的层 设置层的外边距 .div {Width:500px height:300px;// 高度可以不设 Margin: -150px 0 0 -250px; position:relative; 相对定位 background-color:pink;// 方便看效果 left:50%; top:50%;}
2.JavaScript 部分
1) js 中 的基本数据类型有哪些?
答案:数值类型(number)、字符串类型(string)、布尔类型(boolean)、对象类型:(abject)、未定义类型(underfined)。
2)jQuery 和 JavaScript 相比的优缺点?
答案:优点:实现了脚本和页面的分离;最少的代码做最多的事(这也是 jQuery 的口号);性能更好,几乎解决了所有的浏览器兼容问题;
缺点:不能向后兼容;插件的兼容性(各版本之间不能很好的兼容),在同一个页面使用多个插件可能会出现冲突现象;稳定性方面也有待提高。
3)谈谈 This 对象的理解。
答案:this 是 js 的一个关键字,随着函数使用场合不同,this 的值会发生变化。但是总有一个原则,那就是 this 指的是调用函数的那个对象。this 一般情况下:是全局对象 Global。作为方法调用,那么 this 就是指这个对象。
3. 职位相关问题
1)前端技术有哪些?还有哪些相关的书籍?
答案:JavaScript jQuery HTML5 CSS3(移动端框架:jQuery mobile Phonegap Bootstra 移动端开发工具等)。
书籍:《精通 JavaScript》、《锋利的 jQuery》、《编写高质量代码:web 前端开发修炼之道》、《SEO 教程:搜索引擎优化入门与进阶》等。
2) 对前端界面工程师这个职位是怎么样理解的?
答案:前端是最贴近用户的程序员,比后端、数据库、产品经理、运营、安全都近。前端的能力就是能让产品从 90 分进化到 100 分,甚至更好,参与项目,快速高质量完成实现效果图,精确到 1px;与团队成员,UI 设计,产品经理的沟通;做好的页面结构,页面重构和用户体验;处理 hack,兼容、写出优美的代码格式;针对服务器的优化、拥抱最新前端技术。