前端面试题整理（一）

一<!DOCTYPE>标签的定义与用法

<!DOCTYPE>声明位于文档中的最前面位置，处于html标签之前。此标签可告知浏览器文档使用哪种html或xhtml规范，该声明可有三种DTD类型，分别为严格版（strict）过渡板（Transitional）以及基于框架的HTMl文档（Frameset）。

二块纪元素和行内元素都有哪些？

块级元素	行内元素	可变元素
标题：<h1>~<h6>	图像标签：<img>	applet
段落：<p>	超链接标签:<a>	button
水平线：<hr />	范围标签：<span>	del
有序列表:<ol>-<li>	换行标签：<br />	iframe
无序列表：<ul>-<li>	输入框：<input>	map
定义列表：<dl>-<dt>-<dd>	多行文本域：<textarea>	object
表格：<table>		script
表单：<form>
分区：<div>

三你真的了解html吗？

<P>哥写的不是html，是寂寞。<br><br>&nbsp;&nbsp;我说：<br>不要迷恋哥；哥只是个传说

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

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

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

对原题改进的结果：

html:
<p>哥写的不是HTML，是寂寞。<p>我说：<br> 不要迷恋哥，哥只是一个传说

xhtml:
<p>哥写的不是HTML，是寂寞。</p><p>我说：<br /> 不要迷恋哥，哥只是一个传说</p>

加分：合理的用语义化标签
如“我说”的话，可以用q标签标注。如果再进一步，“我”用cite标注，“HTML” 用abbr或acronym标注（至于再讨论abbr和acronym的区别就太较真了），也OK。再复杂就没必要了。

<p> 哥写的不是<abbr title=”Hyper Text Markup Language”>HTML</abbr>，是寂寞。
<p><cite> 我</cite>说：<br> <q>不要迷恋哥，哥只是一个传说</q>

本文出自 “前端or后端” 博客，谢绝转载！