这是我第一次参加前端岗面试,学长给的内推,自己平时有做过web,对于前端的知识,大多都是用的模板,在面试前也刷了几天的面试题,但没问到,阿里这种公司对于刚入职场的问的还是很基础的,然而回答的也很糟糕,希望记录经历,能早日找到一份好工作。
刚开始问了一些学习经历、项目经历和对未来工作的想法。
语义化标签的作用和意义,试着举几个例子。
没听过语义化标签的我回答的一塌糊涂,只说了和标签的作用,出来查了查,语义化标签是h5的新特性,指使一个标签具有意义。语义化标签的作用是使代码结构完整,有利于SEO,提升用户体验,便于团队开发和维护,方便其他设备解析。举一些例子:
指包含这一块内容的标题,有h1到h6这些等级。 background: url(../image/1.jpg) right bottom no-repeat, url(../image/2.jpg) left top repeat;
2、颜色透明度(rgba)
background: rgba(0,0,0,.5);
3、过渡和动画
transition: width 1s linear 2s;
过渡效果,transition通过指定某些属性和变幻参数,以原始定义为开始状态,通过鼠标操作变化(hover),hover状态定义结束状态,实现过渡效果。
animation: myfirst 5s;
@keyframes myfirst {
0% {background: block;}
25% {background: red;}
50% {background: yellow;}
100% {background: green;}
}
动画效果,加强版的过渡效果,通过animation指定动画名和动画参数,@keyframes定义动画内容,根据参数自动触发。
4、多列布局和弹性盒模型
display:flex;
5、盒子的变幻(2D:3D)
transform: translate(50px,100px);//移动
transform: rotate();//旋转
transform: scale();//缩放
transform: skew();//倾斜
用于元素的直接或者鼠标感应变化,没有其他变幻参数(如延时,持续时间,变幻曲线),立即改变。
###引入Web字体(在服务器端存储)
@font-face {
font-family: myfirstfont;
src: url(sansation_light.woff);
}
div {
font-family: myfirstfont;
}
6、媒体查询
body{
background: yellow;
}
@media screen and (max-width: 480px){
background: red;
}
7、阴影
h1 {//文字阴影
text-shadow: 5px 5px 5px red;
}
div {//盒子阴影
box-shadow: 10px 5px 5px yellow;
}
有没有用过CSS3做过动画?
没做过,这个知识点比较大,还需要接下来学习。
js的继承。
我回答了原型链的继承,原型链我还不会,要认真学习。
平时是怎么调试前端代码的?
我回答用的是用F12加断点调试的,加alert或console.log,vue的devtools还没怎么用过。搜了一下觉得这个还不错:
https://blog.csdn.net/YaoDeBiAn/article/details/86761412
http的状态码举例
我回答了404和503.总结一下就是开头,为1的是消息,2是成功,3是重定向,5、6是服务器错误。最常用的:
- 100 继续请求
- 200 成功
- 202 已接受请求但处理尚未完成
- 403 资源不可用
- 404 未找到资源
- 503 服务器由于维护或者负载过重未能应答。
http属于哪一层?层级怎么传递信息的?
应用层,七层分别为:应用层、表示层、会话层、传输层、网络层、数据链路层、物理层。可以看一下这个:
https://blog.csdn.net/weixin_40304276/article/details/81509074
总而言之,面试比较基础,自己学的太差,前路渺茫,仍需努力。