前端常见面试题

HTML部分

1、你做的页面在哪些流览器测试过？这些浏览器的内核分别是什么?

1、IE浏览器（Internet explorer）  trident内核    

2、火狐浏览器（Firefox）              gecko内核

3、谷歌浏览器（Chrome）             Blink(基于webkit，Google与OperaSoftware共同开发)

4、苹果浏览器（Safari）                webkit内核

5、欧朋浏览器（Opera）               以前是presto内核，Opera现已改用GoogleChrome的Blink内核

2、行内元素、块元素和行内块元素都有什么？区别是什么？ *****

HTML可以将元素分类方式分为行内元素、块状元素和行内块状元素三种。首先需要说明的是，这三者是可以互相转换的，使用display属性能够将三者任意转换：

(1)display:inline;转换为行内元素

(2)display:block;转换为块状元素

(3)display:inline-block;转换为行内块状元素

行内元素主要有：

span,strong, em, label, select, textarea

特征如下：

(1)设置宽高无效

(2)对margin仅设置左右方向有效，上下无效；padding设置上下左右都有效，即会撑大空间

(3)不会自动进行换行

 块状元素代表性的就是div，其他如p、nav、aside、header、footer、section、article、ul-li、address等等，都可以用div来实现。

块状元素特征：

(1)能够识别宽高

(2)margin和padding的上下左右均对其有效

(3)可以自动换行

(4)多个块状元素标签写在一起，默认排列方式为从上至下

行内块状元素

综合了行内元素和块状元素的特性，但是各有取舍。因此行内块状元素在日常的使用中，由于其特性，使用的次数也比较多。

行内块状元素主要有img、input.

特征：

        (1)不自动换行

        (2)能够识别宽高

        (3)默认排列方式为从左到右

3、<image>标签上title属性与alt属性的区别是什么？

title属性为设置该属性的元素提供建议性的信息，alt属性是为了给那些不能看到你文档中图像的浏览者提供文字说明的

4、请写出至少5个html5新增的标签，并说明其语义和应用场景？

section：定义文档中的一个章节

nav：定义只包含导航链接的章节

header：定义页面或章节的头部。它经常包含 logo、页面标题和导航性的目录。

footer：定义页面或章节的尾部。它经常包含版权信息、法律信息链接和反馈建议用的地址。

aside：定义和页面内容关联度较低的内容——如果被删除，剩下的内容仍然很合理。

5、html5有哪些新特性、移除了那些元素？ ***

a. HTML5 主要是关于图像，位置，存储，多任务等功能的增加。

b. 拖拽释放(Drag and drop) API

c. 语义化更好的内容标签（header,nav,footer,aside,article,section）

d. 音频、视频API(audio,video)

e. 画布(Canvas) API

f. 地理(Geolocation) API

g. 本地离线存储 localStorage 长期存储数据，浏览器关闭后数据不丢失

h. sessionStorage 的数据在页面会话结束时会被清除

i. 表单控件，calendar、date、time、email、url、search

移除的元素：

a. 纯表现的元素：basefont，big、u等；

b. 对可用性产生负面影响的元素：frame，frameset等

6. iframe的优缺点？ **

优点：

a. 解决加载缓慢的第三方内容如图标和广告等的加载问题

b. iframe无刷新文件上传

c. iframe跨域通信

缺点：

a. iframe会阻塞主页面的Onload事件

b. 无法被一些搜索引擎索引到

c. 页面会增加服务器的http请求

d. 会产生很多页面，不容易管理。

7、  (1)设置文字水平居中的属性是？(2)设置标签盒子水平居中的属性是？