首页 > web前端 > html教程 > 从雅虎流传出来的经典面试题_html/css_WEB-ITnose

从雅虎流传出来的经典面试题_html/css_WEB-ITnose

WBOY
发布: 2016-06-24 11:55:41
原创
1112 人浏览过

有这么一段HTML,请挑毛病:

  1.   哥写的不是HTML,是寂寞。

      我说:
    不要迷恋哥,哥只是一个传说

复制代码


这是原来雅虎一道笔试题(文字变了变),用了很多年了,还没有一个人完全答对过。
============== 解答部分 ==============

出这道题的动机是,太多人觉得HTML太简单,但它恰恰又是前端开发中最基础最重要的部分。HTML结构设计的合不合理,直接影响到代码易不易维护,灵不灵活,同时事关网页性能,协作效率。碰到不少人认为前端开发就是javascript开发,大错特错啊。javascript, html, css这三个前端开发的基础支柱,性质完全不同又紧密关联,对它们的正确理解,合理应用是专业与非专业的区别。有些后端工程师可以写出很漂亮的JS,但他们真的不懂怎么合理的把js, html, css结合起来应用。对html的准确把握,不像学一般的编程语言那样,而是建立在丰富实践经验和体会的基础上,是前端的工程师的基本功。

这不是一道较真题或是装逼题,正经一道“画鸡蛋”的题,考的是基本功。代码如其人,对一行代码的理解足以反映出他的前端开发素养。

言归正传。这道题的考点:

考点1:html和 xhtml的区别
这行代码在html 4.01 strict下是完全正确的,在xhtml 1.0 strict下是错误一堆的。所以明显是一个考点。在xhtml下所有标签是闭合的,p,br需要闭合, 标签不允许大写,P要小写。同时nbsp和br必须包含在容器里。html下这些都不是错。p在html里是可选闭合标签,是可以不用闭合的。

这个考点告诉你xhtml是多么苛刻。这是基本考点,答对,你能拿到60分。

考点2:考样式分离
用nbsp控制缩进是不合理的。应该用CSS干这事。所以应该删掉nbsp

考点3:合理使用标签
br是强制折行标签,p是段落。原题用连续的br制造两个段落的效果,效果是达到了,但显然用的不合理,段落间距后期无法再控制。正确的做法是用两个p表现两个段落。“我说”后面是正常的文字折行用br是合理的。

上面全答对,你就能拿到100分。

对原题改进的结果:
html 4.01:

  1. 哥写的不是HTML,是寂寞。

    我说:
    不要迷恋哥,哥只是一个传说

复制代码


xhtml 1.0:

  1. 哥写的不是HTML,是寂寞。

    我说:
    不要迷恋哥,哥只是一个传说

复制代码


加分:合理的用语义化标签
在前面的基础上合理的用语义化标签,对内容进行必要的标记,是加分的。但过度的使用标签,就画蛇添足了。如“我说”的话,可以用q标签标注。

  1. 哥写的不是HTML,是寂寞。

  2. 我说:
    不要迷恋哥,哥只是一个传说

复制代码


我觉得这就够了,如果再进一步,“我”用cite标注,“HTML” 用abbr或acronym标注(至于再讨论abbr和acronym的区别就太较真了),也OK。再复杂就没必要了。

  1. 哥写的不是HTML,是寂寞。

  2. 说:
    不要迷恋哥,哥只是一个传说

复制代码

来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板