一些面试题1

1. 请写出5个hTml5新增的标签中文和英文
   header — 头部标签
   - nav — 导航标签
   - article — 内容标签
   - section — 块级标签
   - aside — 侧边栏标签
   - footer — 尾部标签
   Video视频
   Audio音频

2. 请写出视频属性中6个属性
   autoplay视频就绪后立马播放
   controls视频的播放控件
   loop循环播放
   muted视频静音
   poster下载时显示的图像,值为url
   Src 路径
   Width 宽度
   Height高度

3. 请写出input中10种type类型
   button 按钮 text 默认文本 radio 单选 checkbox 复选框 submit 提交
   password 密码 reset 重置 color 颜色 number 数字 file 上传文件
   url 网址 email 邮箱 tel手机号 search 搜索框 date 日期 range 滑块
   time 时间 month 月 week 周

4. 请写出表单中8种属性
   multiple 可以上传多个文件，通常与file搭配使用 -->
   <-- placeholder 表单的请示文字 -->
   <-- required 表单输入不能为空 -->
   <-- autofocus设置默认焦点 -->
   <-- autocomplete记录历史输入 on打开 off关闭 -->
   <-- pattern 正则验证 -->
   <-- min max 数字的值 通常与number和range -->
   <-- step 数字的跳跃间隔 -->
   <-- readonly只读模式 -->
   <-- disabled禁用模式 -->

5. 请写出web存储中3大存储的区别
   localStorage - 用于长久保存整个网站的数据，保存的数据没有过期时间，直到手动去除。
   sessionStorage - 用于临时保存同一窗口(或标签页)的数据，在关闭窗口或标签页之后将会删除这些数据。
   localStorage和sessionStorage 存储大小为5MB
   Cookie可设置过期时间，存储大小为4kb，请求时呆在http请求头中

6. Css3中有几种盒模型，分别是哪几种，有什么区别？
   2种，
   1.标准盒子模型
   box-sizing:content-box;
   2.IE盒子模型||怪异盒子模型
   box-sizing: border-box;
   标准盒子模型：当盒子设置内边距时，会把原本的盒子大小撑大说明是标准盒子，
   IE盒子模型：当盒子设置内边距时，不把原本的盒子大小撑大说明是IE盒子，且内边距大小没有超过自身宽度高度，超过自身宽度高度也会撑大

7. 弹性盒子对齐方式有哪几种？分别是哪几种？有什么区别？
   3种
   justify-content 设置弹性盒子元素在主轴（横轴）方向上的对齐方式。
   align-items 设置弹性盒子元素在侧轴（纵轴）方向上的对齐方式。
   align-content 修改 flex-wrap 属性的行为，类似 align-items, 但不是设置子元素对齐，而是设置行对齐

8. 文字单行省略和多行省略如何实现
   单行省略
   overflow: hidden;
   /* 强制在一行显示 /
   white-space: nowrap;
   / 显示省略号 /
   text-overflow: ellipsis;
   多行省略
   display: -webkit-box;/ //对象作为弹性伸缩盒子模型显示 /
   overflow: hidden;/ //溢出隐藏 /
   -webkit-box-orient: vertical;/ //设置伸缩盒子对象的子元素的排列方式 /
   -webkit-line-clamp: 3;/ //设置 块元素包含的文本行数 */

9. 请写出清除浮动的5种方式

10. 给父级div定义伪类：after和zoom
    .clearfloat:after{display:block;clear:both;content:“”;overflow:hidden;height:0;}
    .clearfloat{zoom:1;}

11. 在浮动尾部添加空div标签clear:both;

12. 父级div定义overflow:hidden

13. 父级给高度height

14. 父级随子级一起浮动

15. 父级div定义overflow:auto

16. 父级div定义为表格display:table

17. 加br标签

18. 请写出浏览器5大兼容性
    -o- 欧朋浏览器
    -moz- 火狐浏览器
    -ms- IE浏览器
    -webkit- 谷歌和Safari 浏览器