课程咨询:400-111-8989

  • 面试技巧-HTML5前端面试题汇总(二)

    发布:HTML5培训  来源:html5就业指导  时间: 2018年07月23日

  • 在上篇文章中小编为正准备参加HTML5面试的小伙伴们准备了HTML5前端面试题汇总(一),不知道大家看过之后是否觉得有所帮助呢。今天小编将继续为大家带来关于HTML5前端面试题汇总的第二部分,希望本篇文章能够对正准备参加面试的小伙伴们有所帮助。快来和小编一起看看今天的面试题都有哪些吧!...

  • 在上篇文章中小编为正准备参加HTML5面试的小伙伴们准备了HTML5前端面试题汇总(一),不知道大家看过之后是否觉得有所帮助呢。今天小编将继续为大家带来关于HTML5前端面试题汇总的第二部分,希望本篇文章能够对正准备参加面试的小伙伴们有所帮助。快来和小编一起看看今天的面试题都有哪些吧!

    面试技巧-HTML5前端面试题汇总(二)

    1. 知道css有个content属性吗?有什么作用?有什么应用?

    知道。css的content属性专门应用在 before/after 伪元素上,用来插入生成内容。最常见的应用是利用伪类清除浮动。

    //一种常见利用伪类清除浮动的代码

    .clearfix:after {
    
    content:"."; //这里利用到了content属性
    
    display:block;
    
    height:0;
    
    visibility:hidden;
    
    clear:both; }
    
    .clearfix {
    
    *zoom:1;
    
    }

    after伪元素通过 content 在元素的后面生成了内容为一个点的块级素,再利用clear:both清除浮动。

    那么问题继续还有,知道css计数器(序列数字字符自动递增)吗?如何通过css content属性实现css计数器?

    答案:css计数器是通过设置counter-reset 、counter-increment 两个属性 、及 counter()/counters()一个方法配合after / before 伪类实现。

    2. 如何在 HTML5 页面中嵌入音频?

    HTML 5 包含嵌入音频文件的标准方式,支持的格式包括 MP3、Wav 和 Ogg:

    <audio controls>
    
    <source src="jamshed.mp3" type="audio/mpeg">
    
    Your browser does'nt support audio embedding feature.
    
    </audio>

    3. 如何在 HTML5 页面中嵌入视频?

    和音频一样,HTML5 定义了嵌入视频的标准方法,支持的格式包括:MP4、WebM 和 Ogg:

    <video width="450" height="340" controls>
    
    <source src="jamshed.mp4" type="video/mp4">
    
    Your browser does'nt support video embedding feature.
    
    </video>

    4. HTML5 引入什么新的表单属性?

    Datalist datetime output keygen date month week time number range emailurl

    5. CSS3新增伪类有那些?

    p:first-of-type 选择属于其父元素的首个 <p> 元素的每个 <p> 元素。

    p:last-of-type 选择属于其父元素的最后 <p> 元素的每个 <p> 元素。

    p:only-of-type 选择属于其父元素唯一的 <p> 元素的每个 <p> 元素。

    p:only-child 选择属于其父元素的唯一子元素的每个 <p> 元素。

    p:nth-child(2) 选择属于其父元素的第二个子元素的每个 <p> 元素。

    :enabled、:disabled 控制表单控件的禁用状态。

    :checked,单选框或复选框被选中。

    6. 描述一段语义的html代码吧。

    (HTML5中新增加的很多标签(如:<article>、<nav>、<header>和<footer>等)

    就是基于语义化设计原则)

    < div id="header">

    < h1>标题< /h1>

    < h2>专注Web前端技术< /h2>

    < /div>

    语义 HTML 具有以下特性:

    文字包裹在元素中,用以反映内容。例如:

    段落包含在 <p> 元素中。

    顺序表包含在<ol>元素中。

    从其他来源引用的大型文字块包含在<blockquote>元素中。

    HTML 元素不能用作语义用途以外的其他目的。例如:

    <h1>包含标题,但并非用于放大文本。

    <blockquote>包含大段引述,但并非用于文本缩进。

    空白段落元素 ( <p></p> ) 并非用于跳行。

    文本并不直接包含任何样式信息。例如:

    不使用 <font> 或 <center> 等格式标记。

    类或 ID 中不引用颜色或位置。

    7. cookie在浏览器和服务器间来回传递。 sessionStorage和localStorage区别

    sessionStorage和localStorage的存储空间更大;

    sessionStorage和localStorage有更多丰富易用的接口;

    sessionStorage和localStorage各自独立的存储空间;

    8. html5有哪些新特性、移除了那些元素?如何处理HTML5新标签的浏览器兼容问题?如何区分 HTML 和 HTML5?

    * HTML5 现在已经不是 SGML 的子集,主要是关于图像,位置,存储,多任务等功能的增加。

    * 绘画 canvas

    用于媒介回放的 video 和 audio 元素

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

    sessionStorage 的数据在浏览器关闭后自动删除

    语意化更好的内容元素,比如 article、footer、header、nav、section

    表单控件,calendar、date、time、email、url、search

    新的技术webworker, websockt, Geolocation

    * 移除的元素

    纯表现的元素:basefont,big,center,font, s,strike,tt,u;

    对可用性产生负面影响的元素:frame,frameset,noframes;

    支持HTML5新标签:

    * IE8/IE7/IE6支持通过document.createElement方法产生的标签,

    可以利用这一特性让这些浏览器支持HTML5新标签,

    浏览器支持新标签后,还需要添加标签默认的样式:

    * 当然最好的方式是直接使用成熟的框架、使用最多的是html5shim框架

    <!--[if lt IE 9]>
    
    <script> src="http://html5shim.googlecode.com/svn/trunk/html5.js"</script>
    
    <![endif]-->

    9. HTML5的离线储存?

    localStorage 长期存储数据,浏览器关闭后数据不丢失;

    sessionStorage 数据在浏览器关闭后自动删除。

    10. 写出HTML5的文档声明方式

    <!DOCTYPE html>

    11. HTML5和CSS3的新标签

    HTML5: nav, footer, header, section, hgroup, video, time, canvas, audio...

    CSS3: RGBA, opacity, text-shadow, box-shadow, border-radius, border-image,

    border-color, transform...;

    12. 自己对标签语义化的理解

    网页使用什么HTML标签要看这个元素是什么元素,而不是看这个元素像什么元素。

    例如我们用h2标签,是因为这个元素是二级标题,而不是因为它看起来比较字体比较粗比较大。

    以上就是小编今天为大家分析的HTML5前端面试题汇总的第二篇文章,希望本篇文章对正准备参加HTML5面试的小伙伴有所帮助,想要了解更多HTML5面试相关信息,记得关注达内HTML5培训官网哦。准备参加面试的小伙伴,一定要把这些面试题牢牢掌握,在面试的时候派上用上,最后希望小伙伴们能够顺利通过面试,找到适合自己的工作。

  • 上一篇:面试技巧-HTML5前端面试题汇总(一)

    下一篇:没有下一篇了

网站导航
2002-2018 达内时代科技集团有限公司 版权所有 京ICP证8000853号-56