CSS常见面试题：看看你知道多少 - 送吗网
CSS常见面试题：看看你知道多少
前端科技 阅读:9
针对接下来很多应届生面临找工作面试的问题，我将会总结少量前台面试常见的问题和大家分享。希望可以帮助到即将进入职场的同学们。话不多说，我们开始吧。1 display有哪些值？说明他们的作使用?inline（默认）--内联none--隐藏block--块显示table--表格显示list-item--项目列表inline-block -- 行内块2 position的值？static（默认）：按照正常文档流进行排列；relative（相对定位）：不脱离文档流，参考自身静态位置通过 top, bottom, left, right 定位；absolute(绝对定位)：参考距其最近一个不为static的父级元素通过top, bottom, left, right 定位；fixed(固定定位)：所固定的参照对像是可视窗口。3 CSS3有哪些新特性？RGBA和透明度background-image background-origin(content-box/padding-box/border-box) background-size background-repeatword-wrap（对长的不可分割单词换行）word-wrap：break-word文字阴影：text-shadow： 5px 5px 5px #FF0000;（水平阴影，垂直阴影，模糊距离，阴影颜色）font-face属性：定义自己的字体圆角（边框半径）：border-radius 属性使用于创立圆角边框图片：border-image: url(border.png) 30 30 round盒阴影：box-shadow: 10px 10px 5px #888888媒体查询：定义两套css，当浏览器的尺寸变化时会采使用不同的属性4 请解释一下CSS3的flexbox（弹性盒布局模型）,以及适使用场景？该布局模型的目的是提供一种更加高效的方式来对容器中的条目进行布局、对齐和分配空间。在传统的布局方式中，block 布局是把块在垂直方向从上到下依次排列的；而 inline 布局则是在水平方向来排列。弹性盒布局并没有这样内在的方向限制，能由开发人员自由操作。试使用场景：弹性布局适合于移动前台开发，在Android和ios上也完美支持。希望可以帮助到你，欢迎你给我留言。> 常见web前端面试问题有哪些
常见web前端面试问题有哪些
时间：     来源：web前端面试问题分享
我们生活在互联网时代，web前端工程师对各大公司来讲可谓是十分重要的职位。因此，现在很多公司众薪聘请web前端工程师，有人说web前端工程师面试是一个自我提升的过程，而又有人十分的惧怕web前端工程师面试，担心自己面试未通过，没办法找到心仪的工作。小编要对你说，别担心，小编告诉你一般公司会问的常见web前端面试问题有哪些?
HTML+CSS3部分：
1、什么是盒子模型?
在网页中，一个元素占有空间的大小由几个部分构成，其中包括元素的内容(content)，元素的内边距(padding)，元素的边框(border)，元素的外边距(margin)四个部分。这四个部分占有的空间中，有的部分可以显示相应的内容，而有的部分只用来分隔相邻的区域或区域。4个部分一起构成了css中元素的盒模型。
2、行内元素有哪些?块级元素有哪些?空(void)元素有那些?
行内元素：a、b、span、img、input、strong、select、label、em、button、textarea
块级元素：div、ul、li、dl、dt、dd、p、h1-h6、blockquote
空元素：即系没有内容的HTML元素，例如：br、meta、hr、link、input、img
3、CSS实现垂直水平居中
一道经典的问题，实现方法有很多种，以下是其中一种实现：
HTML结构：
&div class=&wrapper&
&div class=&content&&&/div&
.wrapper{position:}
background-color:#6699FF;
height:200
position: //父元素需要相对定位
left: 50%;
margin-top:-100 //二分之一的height，width
margin-left: -100
4、简述一下src与href的区别
href是指向网络资源所在位置，建立和当前元素(锚点)或当前文档(链接)之间的链接，用于超链接。
src是指向外部资源的位置，指向的内容将会嵌入到文档中当前标签所在位置;在请求src资源时会将其指向的资源下载并应用到文档内，例如js脚本，img图片和frame等元素。当浏览器解析到该元素时，会暂停其他资源的下载和处理，直到将该资源加载、编译、执行完毕，图片和框架等元素也如此，类似于将所指向资源嵌入当前标签内。这也是为什么将js脚本放在底部而不是头部。
5、什么是CSS Hack?
一般来说是针对不同的浏览器写不同的CSS,就是 CSS Hack。IE浏览器Hack一般又分为三种，条件Hack、属性级Hack、选择符Hack(详细参考CSS文档：css文档)。例如：
// 1、条件Hack
&!--[if IE]
.test{color:}
![endif]--&
// 2、属性Hack
color:#0909; /* For IE8+ */
*color:#f00; /* For IE7 and earlier */
_color:#ff0; /* For IE6 and earlier */
// 3、选择符Hack
* html .test{color:#090;} /* For IE6 and earlier */
* + html .test{color:#ff0;} /* For IE7 */
6、简述同步和异步的区别
同步是阻塞模式，异步是非阻塞模式。
同步就是指一个进程在执行某个请求的时候，若该请求需要一段时间才能返回信息，那么这个进程将会一直等待下去，直到收到返回信息才继续执行下去;
异步是指进程不需要一直等下去，而是继续执行下面的操作，不管其他进程的状态。当有消息返回时系统会通知进程进行处理，这样可以提高执行的效率。
7、px和em的区别
px和em都是长度单位，区别是，px的值是固定的，指定是多少就是多少，计算比较容易。em得值不是固定的，并且em会继承父级元素的字体大小。
浏览器的默认字体高都是16px。所以未经调整的浏览器都符合: 1em=16px。那么12px=0.75em, 10px=0.625em
8、什么叫优雅降级和渐进增强?
渐进增强 progressive enhancement：
针对低版本浏览器进行构建页面，保证最基本的功能，然后再针对高级浏览器进行效果、交互等改进和追加功能达到更好的用户体验。
优雅降级 graceful degradation：
一开始就构建完整的功能，然后再针对低版本浏览器进行兼容。
a.优雅降级是从复杂的现状开始，并试图减少用户体验的供给
b.渐进增强则是从一个非常基础的，能够起作用的版本开始，并不断扩充，以适应未来环境的需要
c.降级(功能衰减)意味着往回看;而渐进增强则意味着朝前看，同时保证其根基处于安全地带
9、浏览器的内核分别是什么?
IE: trident内核
Firefox：gecko内核
Safari：webkit内核
Opera：以前是presto内核，Opera现已改用Google Chrome的Blink内核
Chrome：Blink(基于webkit，Google与Opera Software共同开发)
1、怎样添加、移除、移动、复制、创建和查找节点?
1)创建新节点
createDocumentFragment //创建一个DOM片段
createElement //创建一个具体的元素
createTextNode //创建一个文本节点
2)添加、移除、替换、插入
appendChild //添加
removeChild //移除
replaceChild //替换
insertBefore //插入
getElementsByTagName //通过标签名称
getElementsByName //通过元素的Name属性的值
getElementById //通过元素Id，唯一性
2、实现一个函数clone，可以对JavaScript中的5种主要的数据类型(包括Number、String、Object、Array、Boolean)进行值复制。
*支持基本数据类型及对象
function clone(obj) {
switch (typeof obj) {
case &undefined&:
case &string&:
o = obj + &&;
case &number&:
o = obj - 0;
case &boolean&:
case &object&: // object分为两种情况对象(Object)或数组(Array)
if (obj === null) {
if (Object.prototype.toString.call(obj).slice(8 -1) === &Array&) {
for (var i = 0; i obj. i++) {
o.push(clone(obj[i]));
for (var k in obj) {
o[k] = clone(obj[k]);
3、如何消除一个数组里面重复的元素?
//方法一：
var arr1 =[],
for(var i = 0len = arr1. i& i++){
if(arr2.indexOf(arr1[i]) & 0){
arr2.push(arr1[i]);
document.write(arr2); // 1,2,3,4,5,6
4、想实现一个对页面某个节点的拖曳?如何做?
使用原生JS
5、在Javascript中什么是伪数组?如何将伪数组转化为标准数组?
伪数组(类数组)：无法直接调用数组方法或期望length属性有什么特殊的行为，但仍可以对真正数组遍历方法来遍历它们。典型的是函数的argument参数，还有像调用getElementsByTagName,document.childNodes之类的,它们都返回NodeList对象都属于伪数组。可以使用Array.prototype.slice.call(fakeArray)将数组转化为真正的Array对象。
function log{
var args = Array.prototype.slice.call(arguments);
//为了使用unshift数组方法，将argument转化为真正的数组
args.unshift('(app)');
console.log.apply(console args);
6、Javascript中callee和caller的作用?
caller是返回一个对函数的引用，该函数调用了当前函数;
callee是返回正在被执行的function函数，也就是所指定的function对象的正文。
7、请描述一下cookies，sessionStorage和localStorage的区别
sessionStorage用于本地存储一个会话(session)中的数据，这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。因此sessionStorage不是一种持久化的本地存储，仅仅是会话级别的存储。而localStorage用于持久化的本地存储，除非主动删除数据，否则数据是永远不会过期的。
web storage和cookie的区别
Web Storage的概念和cookie相似，区别是它是为了更大容量存储设计的。Cookie的大小是受限的，并且每次你请求一个新的页面的时候Cookie都会被发送过去，这样无形中浪费了带宽，另外cookie还需要指定作用域，不可以跨域调用。
除此之外，Web Storage拥有setItem,getItem,removeItem,clear等方法，不像cookie需要前端开发者自己封装setCookie，getCookie。但是Cookie也是不可以或缺的：Cookie的作用是与服务器进行交互，作为HTTP规范的一部分而存在 ，而WebStorage仅仅是为了在本地&存储&数据而生。
8、手写数组快速排序
关于快排算法的详细说明，可以参考阮一峰老师的文章快速排序
&快速排序&的思想很简单，整个排序过程只需要三步：
(1)在数据集之中，选择一个元素作为&基准&(pivot)。
(2)所有小于&基准&的元素，都移到&基准&的左边;所有大于&基准&的元素，都移到&基准&的右边。
(3)对&基准&左边和右边的两个子集，不断重复第一步和第二步，直到所有子集只剩下一个元素为止。
9、统计字符串&aaaabbbccccddfgh&中字母个数或统计最多字母数。
var str = &aaaabbbccccddfgh&;
var obj = {};
for(var i=0;istr.i++){
var v = str.charAt(i);
if(obj[v] & obj[v].value == v){
obj[v].count = ++ obj[v].
obj[v] = {};
obj[v].count = 1;
obj[v].value =
for(key in obj){
document.write(obj[key].value +'='+obj[key].count+' '); // a=4 b=3 c=4 d=2 f=1 g=1 h=1
10、写一个function，清除字符串前后的空格。(兼容所有浏览器)
function trim(str) {
if (str & typeof str === &string&) {
return str.replace(/(^s*)|(s*)$/g&&); //去除前后空白符
人事必问：
1.对前端工程师这个职位你是怎么样理解的?
a.前端是最贴近用户的程序员，前端的能力就是能让产品从 90分进化到 100分，甚至更好
b.参与项目，快速高质量完成实现效果图，精确到1
c.与团队成员，UI设计，产品经理的沟通;
d.做好的页面结构，页面重构和用户体验;
e.处理hack，兼容、写出优美的代码格式;
f.针对服务器的优化、拥抱最新前端技术。
2.期望薪资是多少?
谈到薪资一定不要唯唯诺诺，自己期望的是多少就是多少，这是对自己价值的一种体现，但是我们不能对自己认识不清，对于薪资漫天去说，这样会给HR留下不好的影响。
【推荐阅读】
HTML5热点新闻
主讲人：Xena
主讲人：Scorpio
主讲人：Wing
前端开发技术库
高端IT就业培训专家
全国分校区
关注华清远见
关注创客学院
前台专线：010-
企业培训洽谈专线：010-
院校合作洽谈专线：010-
Copyright ©
北京华清远见科技发展有限公司 版权所有 ，京ICP备号，京公海网安备03号400-650-7353
Web前端面试题：CSS的三种方式都有什么？
在当今的互联网大军中，不少人顺应时代潮流，选择了Web开发作为自己的发展方向，进行。今天，优就业的老师给大家分享一下：CSS的三种方式都有什么?（更多内容推荐：）
1.内嵌样式(Inline Style，直接插入式)
在每一个HTML标签后直接以&style=属性名：属性值&格式书写CSS属性。
2.内部样式表(Internal Style Sheet，内部文档头格式)
将CSS样式通过以
结尾的形式，放在网页的文件头之间。内部样式表只对所在的网页有效。
3.外部文件方式
将编辑好的CSS代码保存为&*.CSS&文件，然后在网页的文档头部加入代码。
官方微信更多精彩，扫码关注 或微信搜索：ujiuye
官方微博更多精彩，扫码关注 或微博搜索：优就业
注：本站稿件未经许可不得转载，转载请保留出处及源文件地址。
(责任编辑：zhangjs)
关键词阅读
[免责声明]本文来源于网络转载，仅供学习交流使用，不构成商业目的。版权归原作者所有，如涉及作品内容、版权和其它问题请在30日内与本网联系，我们将在第一时进行处理
（点击一键加群）「CSS 面试」这一题可以难倒 80% 以上的面试者
16:49:38 +08:00 · 7393 次点击
position 有哪些取值？各取值的意义分别是什么？
我上个月面了 5 个人，全都答得不准确。
所谓准确就是把各取值相对谁定位说清楚。
有人不知道除了 fixed absolute relative 还有哪些取值。
有人不知道 fixed 相对什么定位。（知道但是说不出名字）
答错最多得还是 absolute 相对谁定位。
这反映出大部分新人根本不看标准或者定义，直接用，我只能说你们很勇敢。
注：标题党了， 80% 是我的个人经验，实际应该更高 lol 。
第 1 条附言 &·&
19:13:27 +08:00
但凡是有拿的出手的作品的，我一道基础题都不需要问。
但学生一般没有啊。
第 2 条附言 &·&
07:46:02 +08:00
原来考 position 都是难为面试者啊？
下次遇到没做过项目的面试者，我直接问
你的梦想是什么？
就好了，就不初级，不 low 了吧。
105 回复 &| &直到
09:28:30 +08:00
& & 16:52:31 +08:00
我的经验是...css 大部分属性...稍微问深一点都能难倒一片...
& & 16:53:02 +08:00
@ 不问深，就问定义，就全瞎。
& & 16:53:16 +08:00
我的经历是 absolute 答得出相对谁定位的反而最少
& & 17:02:59 +08:00
上面刚面试一位同学不知道 absolute 相对谁定位。。。
& & 17:07:07 +08:00
@ 能说上来我就要，哈哈
& & 17:11:14 +08:00
@ 可惜很多人只知道相对 relative 定位
& & 17:14:15 +08:00 via iPhone
问题是，这个 position 难道面试的人平时都不用？随便谁，只要是写前端有过一定时间的，肯定会遇到 absolute 相对于谁定位的问题啊。
或者现在写前端的都是用各种 framework ？规避了这些基础？
& & 17:17:59 +08:00
@ 他 /她们一般只知道 absolute 可以相对于祖先中的 relative 定位
& & 17:19:04 +08:00
这都不知道也敢去面前端？
& & 17:19:19 +08:00
@ 然后在工作中也只用 relative & absolute 这一种模式。
& & 17:19:45 +08:00
看了下定义。。果然跟我的认识有点差异。。。
我是后端 lol
& & 17:19:47 +08:00
@ 这样的人很多，而且很多都是从不错的学校出来的……
& & 17:21:07 +08:00
相对 父级元素设了 position 并且不是 static 最近的那个
& & 17:22:30 +08:00
撞墙式编程嘛，这个不对换一个，一直到能成就好了。
对于 CSS 这种东西，这样搞其实也不能说有太大问题。尤其是撞的多了，也就有经验了，说可能说不上来，写可能都是一次过了。
& & 17:23:00 +08:00
auto 的值在哪些情况下等于哪些值，你试试这个，看几个人会。
padding 的值可以是 auto 吗？你再问问，看看几个人说是。
& & 17:27:23 +08:00
突然感觉前端好深奥
& & 17:30:21 +08:00
然而，大部分工作他们中的 80%都能胜任。
& & 17:31:49 +08:00
absolute 相对谁定位确实挺考细节的... 下次放面试题当加分项。
& & 17:35:11 +08:00
会“茴”字的四种写法就很牛？来，楼主来默写一个 Int32 的最大值。
& & 17:35:58 +08:00
因为计算机学校里偏后端, 前端都是学好后端基础稍微学一下, 只要效果对了根本不在乎其它.
或者设计,美工兼的,不是这个专业的.
不知道现在有没有开发一个前端专业
& & 17:41:05 +08:00
(2^32 / 2 ) - 1
很难么？啊哈哈哈……
& & 17:41:17 +08:00
- - 我是 UI ，偶尔帮前端做一些简单的页面.自学的.
有些取值怎么读都不知道~然而不影响我做出来的页面效果.
我觉得能做出东西来就行了吧
就像 UI 你用 ps 也好 sketch 也罢 能画出好 UI 才是硬道理
& & 17:45:55 +08:00
@ 我是指实际的值而不是公式
& & 17:47:30 +08:00
7F FF FF FF
很难么？啊哈哈哈
& & 17:47:51 +08:00
既然是 CSS 的工作，能「合理」的還原設計師的作品、以及交互效果才是最重要的；
其次才是對 CSS 原理的理解，雖然這些理解有助於更好的工作、在工作中碰更少的坑；
但是，如果一個人本身有著不錯的工作能力，卻因為這樣的題目就被否定，對企業也是一個損失，要知道，前端在大陸本身就沒有多少正式的授課，基本都是靠自己摸索和自學。
無論是題目、還是主貼內容、或是樓主的觀點，都太過絕對了。
& & 17:49:26 +08:00
我做前端的时候还是 IE6 时代，我记得 position:fixed 的兼容性是有问题的，所以从来不用
& & 18:00:21 +08:00
哎哟,不错哦, 明天来上班
& & 18:03:31 +08:00
其实这都不是问题……
但是这样就是为什么，前端总会出现要一个一个浏览器适配过去的情况……
& & 18:04:16 +08:00 via Android
@ 面试就像应试，必然有这个缺点
& & 18:13:39 +08:00
@ 现在已经不是 IE 6 时代了，如果现在还在学习陈旧的知识，说明知识获取渠道太陈旧（只会用百度）
& & 18:15:08 +08:00
楼主提供一台电脑，用 google 查找出答案的就留下吧 :)
& & 18:16:54 +08:00 via Android
@ 自带 VPN/Shadowsocks 的加分。
& & 18:18:43 +08:00 via iPhone
@ 能马上提出是否能用 Google 搜索，并看懂英文理解进去，能用自己语言说出个大概，这样的学习能力也是可以的。
& & 19:02:40 +08:00
说真的我原先也没想起来除了 fixed 、 absolute 、 relative 之外还有什么其他的值，于是我搜了下，发现还有一个 static ，然后，我突然想起来那不是默认值么……也难怪。（当然还有 inherit 和 initial 这两个公有的）
如果一个值不经常使用的话，的确会渐渐生疏。
& 这反映出大部分新人根本不看标准或者定义，直接用，我只能说你们很勇敢。
我倒是同意，因为我自己遇到的很多坑都是因为不熟悉标准和定义（里的坑）所以掉进去的。
& @ 现在已经不是 IE 6 时代了，如果现在还在学习陈旧的知识，说明知识获取渠道太陈旧（只会用百度）
这个我倒是不敢苟同了。因为这仅仅只是保守而已，不是说知识有什么问题。
一个合格的程序员应该保证他自己的程序能够在尽量多的兼容各种意外状况。
比如你在 Windows 下面写的代码，跑在 Linux 上就会遇到问题。在这种情况下，你就会想到用兼容性更好的函数 /库来替代操作系统提供的功能。比如微软自家的 MultiByteToWideChar 和开源的 strconv 就是这样的情况。
就 CSS 来说，想要最大限度的进行兼容，就需要避免使用在不同浏览器下会有差异的属性。 fixed 是其中之一。而且要注意， position 是控制布局的属性，如果出现了不兼容的情况，页面的布局就乱了，这样产品就不合格。所以开发人员倾向于避免使用 fixed 没啥问题，直到决策人员下决定说只需要兼容高于某个版本的浏览器，而那些浏览器完全是支持 CSS2 标准的。
& & 19:07:15 +08:00 via iPhone
你知道 sticky 么
& & 19:13:51 +08:00
前端做了两年了，同样答不上的路过。。。
& & 19:18:54 +08:00
哦，看错了你的第三条。
& & 19:25:48 +08:00
我来回答一下， position 属性设置为 absolute 的元素相对于离其最近的已定位祖先元素进行定位。若其祖先元素均非定位元素，则相对于初始包含块进行定位。
& & 19:44:32 +08:00
@ 还好，我见过不会 CSS 的前端
& & 20:02:02 +08:00
也许有人说，这些都是查文档查手册可以得到的，作为面试题太苛刻了。但是我觉得，这些真的都是前端的基本功啊，比如 position 的取值，比如画个盒模型，指一下 width 和 height 从哪儿到哪儿（这个也是我面试时经常能 fail 掉一大帮人的题目）。这样的基础知识，就相当于你在 C/Java/PHP 里面写一个 for 循环，括号里三段的含义是什么一样基础。你们会认为，在面试的时候，写不出 for 循环，然后通过查 Google 查到应该怎么写了，这样就可以过了？
& & 20:02:22 +08:00
没看上面回复，没搜索资料，试试回答下
inherit 继承，这个很多属性都有
static 默认值，占据文档流空间
relative 相对于 static 的位置定位，占据文档流空间
absolute 相对于第一个非 static 父元素定位，不占据文档流空间。如果所有父元素均为 static 值，则相对于 html 这个根元素定位。 html 本身也可以被 absolute 定位，它的参考物则是 viewport
fixed 相对于 viewport 定位，不占据文档流空间
& & 20:04:47 +08:00
另外如果楼主觉得这样的人不好，那可能碰上一种上来就跟你讲 box 模型底层实现， webkit 背后渲染架构再跳回来跟你讲 CSS 的人，你可能也会被发一贴噢。
& & 20:15:26 +08:00
@ 看到这个问题就又去你博客看了遍
& & 20:22:56 +08:00
@ 树大触又黑窝！
& & 20:24:50 +08:00
现在快有 sticky 了
& & 20:25:09 +08:00
@ 想起来还得补充一句， absolute 还得用 top/right/bottom/left 触发，不然还是会呆在原来的位置，不过表现形式和 static 不同 -w-
& & 20:37:59 +08:00
看你面的啥人，我面过的人这个问题大概只有 20%的答不出
另外没说出 sticky 你算答错吗
& & 20:53:40 +08:00 via Android
@ 你们那么关心 sticky 干啥，还在草案阶段。以后说不定会变。
& & 20:57:33 +08:00
不管懂不懂，反正我是做出来了→_→你看呢需要用的时候自然会知道
& & 21:01:35 +08:00 via Android
毫无价值的问题。
面初级切图仔出普通个结构的页面和 html 让写样式就行了。
& & 21:07:44 +08:00 via iPhone
这个问题还好，我觉得 css 的 killer 问题应该是给两个 css selector 问谁的优先级高以及为什么。
没针对复习过能答出来估计是大牛……
& & 21:08:17 +08:00
& & 21:31:32 +08:00
我觉得这个问题能这么难，完全是因为一开始这地方设计得就比较 2B
& & 21:32:16 +08:00
楼主应该问问 CSS3 属性与 Chrome 中的 GraphicsLayer 的联系啊渲染原理啊之类的啪啪啪，见到能答的就收。
& & 21:59:50 +08:00
又复习了一遍...
看了 banri 的回复才知道 fixed 相对于视口 viewport 定位, 所以如果我答相对于浏览器窗口（ browser window ）算“不准确”吗...
实际上问题 “除了 fixed absolute relative 还有哪些取值”确实没什么价值， static 定位即使不知道名字也至少知道有这么一个东西吧，还是你想得到 inherit 这种答复，那么你能说出不能使用 inherit 值的 CSS 属性吗？
initial 值真的有人用吗...
附： CSS 中的 initial 值有什么卵用？：
& & 23:26:56 +08:00
人家好不容易背了半天的 box-sizing 你来问这个？
& & 23:31:51 +08:00
前一段时间也被问了这个问题，答了 5 个，自以为答得不错，被批评不关注新姿势。
查了一下发现现在有 8 个了。。。。
& & 23:33:21 +08:00
int32_max 真没什么好问的，周围不少人都能秒答。
这都是常年要记住的东西。
& & 23:36:31 +08:00
@ 我想表达的是，记住这些东西有用么......Stackoverflow 上一大堆答疑贴，有啥不会直接搜即可。
& & 23:43:52 +08:00
否则还要上这么多课做什么。写代码无非就是照着手册搬，出问题爆栈。学金融的无非一大堆概念和公式，有需要去翻翻书就好了还拿什么 MBA 。
如果只是天天查爆栈的话，大概就只能做个底层民工。高端码农的目标应该是能在爆栈上解决问题，而不是遇到问题去爆栈上找人求助 /找贴参考。（特别是，如果爆栈上一堆人在问的问题，多数是很浅的问题。）
如果是招后端的，面前端面到那么细是不应该。然而你一个前端来面，面得细点并不过分吧。
像这种 position 的知识如果你不知道的话，并不是说要用的时候搜一下就知道了，而是要用的时候你连他们的「存在」都不知道。这就会造成决定性的差异了。
这和回字的多少种写法没太大关系。回随便你怎么写都不影响使用。 CSS 你不能随便写啊。
& & 23:49:00 +08:00
然而校招时这道题必背呀。不过 absolute 这个确实一开始不好理解。
& & 23:57:16 +08:00
面试的目的不是要考倒别人，而是看对方解决问题的能力。
靠这种题目来筛选新手也是难为 LZ 了
& & 00:21:26 +08:00
面试官的初级阶段。
& & 04:40:14 +08:00 via iPad
来吧，前端都看看吧！
& & 06:36:55 +08:00
对于你说的情况，我更希望面试官的问法是：做出某一类的 UI 效果，需要怎么写 CSS/HTML ；而不是默写 position 有几种可能的值。前者可能有多种解法，而后者就是唯一解。
我不太了解 CSS ，但它应该和其它语言一样，解决一个问题，可能有多种做法。如果面试者解决不了某个问题，说他能力差无可厚非；而他若是通过另外的方法，在不依赖使用 position 而解决这个问题的情况下，非要被说成不知道 position 而被淘汰，那则是面试官的问题了。
& & 07:11:14 +08:00
@ 「前者可能有多种解法」
其实并不一定。
比如做排版的时候我不用 div 用表格可以不？其实是可以的。
只不过……
& & 08:30:49 +08:00
对 CSS 基础理解不深刻，往往写出的 HTML 结构很差，甚至混乱。问问基础问题不算什么吧？
& & 08:37:37 +08:00
做好前端要有钻牛角尖的精神
& & 08:48:00 +08:00 via Android
就是 lz 这样的人太多 所以我转行不做前端了
& & 08:51:28 +08:00
昨天占了个沙发...对 LZ 表示深深的赞同...
今天上来一看...就一个感觉...
卧槽...原来真么多人对前端的要求这么低...
& & 08:51:47 +08:00
@ 那你还挺脆弱的。
& & 08:52:22 +08:00
@ 恩，低得出乎我意料。
& & 08:53:34 +08:00
@ 张鑫旭对 CSS 是挺能钻研的。
& & 09:06:24 +08:00
现实情况是：能出作品的不一定能答得出，能答得出的不一定能出作品
& & 09:06:48 +08:00
你问的对，资深的工程师能把 absolute 和 relative 弄混，这样的人不要也罢，
因为团队需要的是：你这个人具有可以依靠的才能（靠谱）。
具体参见我整理过的一篇面试题 ：
& & 09:10:26 +08:00
前端群管理几年下来，总结了下几类人：
刻苦钻研的，任何问题都会举一反三发问，并且找到相关内容系统了解的
“我不是做这个的，我就是偶尔用一下，你就告诉我怎么做就行，我不想知道为什么”
同一个问题，隔几天问一下，至于为什么，就是知其然不知其所以然，然后记忆模糊。
“这个效果怎么做啊”，“有没有人帮我做一下啊”，“这个效果谁有代码，‘分享’一下啊”
多说一句，很多人在群里见到好东西就要人分享，见到就要人分享，就只见他索取，不见有回报。常言道”前端没有秘密“，代码都在那了，有些人就是懒得自己去弄，一定要别人送到嘴边。对这种人，就呵呵了。（楼有点歪，对不住了。）
话说，面试的时候，问问基础的就可以筛选一大批了。这也是不好招人的一大原因。半瓶水太多。
& & 09:16:27 +08:00
@ 有作品就不用答这种题了，因为他在项目经验和动手能力已经加分了。
没作品的话我问什么？只能问基础。
& & 09:23:47 +08:00
@ 我早就弃前端这个坑了。确实，前端知识更新快，但是都是些无用的知识，正如楼上有人所说，茴香豆的茴有几种写法，能写出四种的人并不比写出三种的人高明多少。这些知识对能力提升并没有什么帮助。
& & 09:29:49 +08:00
话说阿里不是让前端、客户端这些岗位的无经验者路转 Java 嘛 XD
& & 09:35:45 +08:00
@ 不可能啊，阿里 Java 这么多， Java 比前端能有
7:1 ，怎么可能让人转 Java 。
& & 09:39:36 +08:00
@ 做 Java 后备军，宁缺毋滥(Java 除外)。
& & 09:44:37 +08:00
sticky 几乎可以忽略掉
& & 09:54:02 +08:00
突然蹦出来一个可以鄙视 80%面试者的前端
楼主前端面试是不是只看之前经验如何? 招过来就直接要干活的?
招学生,有没有培养的打算? 需要计较那么多问题吗?
直接测试对互联网相关的兴趣爱好 不就可以判断是否值得培养了吗?
建议学生们都学客户端吧 IOS/Android 放弃前端这种高大上 接近全栈的工作
我周围的同事对招进来一年不到经验 连 git 都不会的新手都手把手教
我也本以为新手技术很菜,但客户端就让这些&新手& 做出来了
难道&新手& 没有经验的顾虑动手能力更强吗
& & 10:03:22 +08:00
请问招 16 届的吗？坐标哪里
& & 10:21:17 +08:00
表示无压力
& & 10:30:37 +08:00
@ 杭州， 16 届内推时间已过，现在只有统招了。你找工作的话这两个月紧盯各大网站的招聘公告。
过了这两个月机会就少了。
& & 11:00:57 +08:00
其实取值除过通用的那两个，还有： static | relative | absolute | fixed | center | page | sticky
& & 11:32:06 +08:00
都是标准规定的，既然都是规定的都可以搜到，为什么还要作为基础来考？
& & 11:58:08 +08:00
确实问到我了。看标题还以为又是招聘广告。
& & 13:17:35 +08:00
不然楼主给一个答案？不给答案的提问都是找碴。
& & 13:43:04 +08:00
知道 sticky 属性的同学， css 这一块应该不会差。
& & 13:45:22 +08:00
定义，无法找茬。
& & 13:46:23 +08:00
马克一下，我不觉得吐槽这个有什么不好啊~ 之前也有盒模型都不知道的姑娘上来就开 3k ，我觉得太浮躁了，知道答案的人至少知道他切图一般不会有问题，连个大概的答案都说不上来的人，即使有作品也可能是比别人多花两倍时间慢慢调整才做出来的？
& & 13:51:28 +08:00
这道问题我也是每次面试必问，问法少有不同：
1. position 定位有几种方式
2. 这几种方式中，哪些是可以让元素脱离文档流的
然后基本上就要把脱离文档流是什么意思解释一遍。。。
& & 13:52:35 +08:00
哈哈 我也很喜欢问这个。确实很坑爹，很多人都以为前端就是宽高和颜色。。。
& & 16:53:55 +08:00
高中就能被出来我会乱说。
& & 17:39:10 +08:00
确实很基础，不过感觉 initial 和 inherit 两个取值不知道也罢
& & 17:40:39 +08:00
还不如面试他们是否会 google
随便是谁 看到这种问题 都需要 google 的吧
& & 17:51:02 +08:00 via Android
@ 电话?面试，不方便
& & 18:02:53 +08:00 via Android
& · & 1942 人在线 & 最高记录 3541 & · &
创意工作者们的社区
World is powered by solitude
VERSION: 3.9.8.1 · 23ms · UTC 14:37 · PVG 22:37 · LAX 07:37 · JFK 10:37? Do have faith in what you're doing.}