前端基础面试题

面试技巧 时间:2017-06-01 我要投稿

2017前端基础面试题

  关于前端的面试题你有了解过吗?提前的准备对面试有很大的帮助,那么2017年的前端面试题有哪些呢?以下是阳光网小编帮你们整理的2017前端基础面试题,一起来学习啦。

2017前端基础面试题

  2017前端基础面试题(一)

  1、什么时网页三剑客?

  网页三剑客,是一套强大的网页编辑工具,最初是由Macromedia公司开发出来的。由Dreamweaver,Fireworks,Flash三个软件组成,俗称网页三剑客。

  Dreamweaver 是一个“所见即所得”的可视化网站开发工具,主要用于动态网页和静态网页的开发;Fireworks主要是用于对网页上常用的jpg、gif的制作和处理,也可用于制作网页布局;Flash主要用来制作动画,现推出Flash平台,可预见有极好的前景。

  2、怎么调试网页代码?怎么查看网页源代码?

  (1)、按键盘上的F12,打开开发者调试工具;

  (2)、鼠标右键查看页面源代码。

  3、什么是H5?

  H5=HTML5,指的是HTML超文本标记语言(HTML)的第五次重大修改,HTML的第五代。 HTML5具有的特点:

  (1)、语义化的标签:好处是网站加载更快;该标签举例:header、nav、article等。

  (2)、增加了音频、视频标签:好处是取代falsh;该标签举例:audio、video。

  (3)、canvas标签:好处在浏览器上绘制图形或动画,取代flash。

  (4)、支持手机和平板的响应式布局。

  HTML5的缺点:低版本浏览器支持性不好,比如IE9以下的浏览器不支持HTML5。

  4、H5为什么这么火?H5是哪一年产生的`?H5会火多久?

  (1)、因为H5的后台很硬,是谷歌(google)和苹果(Apple)两大巨头公司,谷歌和苹果大力倡导H5的发展,也是H5的忠实的支持者和实践者(IOS+Android系统占据手机市场92.36%),H5的产生主要目的也是干掉flash,因为flash是adobe公司的,adobe不是W3C组织的成员之一,苹果和谷歌等万维网联盟也不希望在自己的产品中使用加载量过大的flash。

  (2)、H5是2014年9月份W3C(万维网联盟,主要有苹果和谷歌公司)组织发布的。

  (3)、刷脸时代(这里专指网站用户体验更加美观的时代)+移动端时代(手机+平板),会促使H5会在未来的有更加美好的发展前景,只要有网站,H5就会很火,UI也就很火,H5的发展会让UI更加提高用户的满意度,H5的火爆时代,会促进UI更好发展。

  (4)、微信的发展,O2O的促使H5更火。

  在这里不得不谈微信,如果没有微信,或许今天我们不会这样来讨论H5,微信无意中养成了用户扫码的习惯,并通过公众号的内容生.产及分发,以及微信本身已有的庞大的用户群体及社交属性,使基于网页的内容可以快速传播,真正带来了APP即浏览器的时代,取消了输入内容网址的麻烦。以微信为代表的超级社交APP,解决了网页内容浏览及分发的通路。 H5或许会没落,但会迎来H6、H7„,只会变得越来越好,所以没必要担心H5会不会死,当下重在实践与积累,至少现在,Html5的影响力,会超出你我的想象,也就意味着H5的好闺蜜UI会一直火下去。

  5、什么叫做响应式?

  针对不用的屏幕显示不同的网页布局,比如说大屏幕手机、小屏幕手机、平板能够适应不同的屏幕来显示网站。

  2017前端基础面试题(二)

  1、行内元素有哪些?块级元素有哪些?空(void)元素有那些?

  (1)、CSS规范规定,每个元素都有display属性,确定该元素的类型,每个元素都有默认的display值,比如div默认display属性值为“block”,成为“块级”元素;span默认display属性值为“inline”,是“行内”元素。

  (2)、行内元素有:a b span img input select strong(强调的语气)

  块级元素有:div ulol li dl dtdd h1 h2 h3 h4„p。

  2、CSS的盒子模型?

  (1)、两种, IE 盒子模型、标准W3C 盒子模型;IE 的content部分包含了 border 和pading;

  (2)、盒模型:内容(content)、填充(padding)、边界(margin)、边框(border)。

  3、浏览器的内核分别是什么?经常遇到的浏览器的兼容性有哪些?

  * IE浏览器的内核Trident、 Mozilla(火狐)的Gecko、google(谷歌)的WebKit、Opera内核Presto;

  * png24为的图片在iE6浏览器上出现背景,解决方案是做成PNG8.

  * 浏览器默认的margin和padding不同。解决方案是加一个全局的*{margin:0;padding:0;}来统一。

  * IE6双边距bug:块属性标签float后,又有横行的margin情况下,在ie6显示margin比设置的大。

  4、页面重构怎么操作?

  编写 CSS、让页面结构更合理化,提升用户体验,实现良好的页面效果和提升性能。

  5、为什么要初始化CSS样式。

  因为浏览器的兼容问题,不同浏览器对有些标签的默认值是不同的,如果没对CSS初始化往往会出现浏览器之间的页面显示差异。

  当然,初始化样式会对SEO有一定的影响,但鱼和熊掌不可兼得,但力求影响最小的情况下初始化。

  *最简单的初始化方法就是: * {padding: 0; margin: 0;} 。

  2017前端基础面试题(三)

  1、div是什么?在div出现之前做网站用什么布局?

  div是网站布局的盒子标签,div出现是table布局,因为table布局嵌套很多,网站加载慢,布局层级不清晰。

  2、html是什么?css是什么?js是什么?

  (1)、html是超文本标记语言,他是做网站时候用的一些文本标记标签,比如div、span等。

  (2)、css是层叠样式表,是做网站的时候给标签来美化网站的样式,比如说background(背景)、color(字体颜色)、height(高度)、width(宽度)等。

  (3)、js=javascript是网站中写前后台交互效果、网页动画效果的一种开发语言,比如鼠标点击事件(click)、前后台数据请求(ajax)等。

  3、什么是前端工程师?什么是后端工程师?

  前端工程师就是指的做静态网页的工程师:

  (1)、广义的前端分为三种:安卓工程师、ios工程师、web前端工程师。

  (2)、狭义的前端指的是web前端工程师,web前端工程师指的是做静态的PC端和手机端静态网页的工程师。

  4、什么是静态网页?什么叫做动态网页?

  (1)、静态网页:没有数据交互的网页,没有数据库参与,没有服务器端数据的加载。比如静态网页就是只有html+css+JavaScript做成的网站。

  (2)、动态网页:有后台数据参与的网页,网页中的数据是从数据库取的,需要有后台逻辑的支持。比如动态网页就是jsp页面(后台语言是java)、asp页面(后台语言是asp.net)。

  5、前端语言有哪些?后端语言有哪些?

  (1)、前端语言:HTML、css、javascript。

  (2)、后端语言(服务器端语言):php、java、asp.net。最近新出的node.js

  6、Doctype作用? 严格模式与混杂模式-如何触发这两种模式,区分它们有何意义?

  (1)、声明位于文档中的最前面,处于标签之前。告知浏览器的解析器,用什么文档类型规范来解析这个文档。

  (2)、严格模式的排版和 JS 运作模式是以该浏览器支持的最高标准运行。

  (3)、在混杂模式中,页面以宽松的向后兼容的方式显示。模拟老式浏览器的行为以防止站点无法工作。

  (4)、DOCTYPE不存在或格式不正确会导致文档以混杂模式呈现。

【2017前端基础面试题】相关文章:

1.2017web前端面试题

2.java基础面试题2017

3.php基础面试题

4..net基础面试题

5.c语言基础面试题及答案

6.java面试题目2017

7.php面试题及答案2017

8.android面试题2017