WEB前端开发工程师面试题.pdf

[HTML && CSS] 1. Doctype? 严格模式与混杂模式 - 如何触发这两种模式，区分它们有何意义 ? Doctype 声明位于文档中的最前面的位置， 处于标签之前。 此标签可告知浏览器文档使用哪种 HTML 或 XHTML规范。 该标签可声明三种 DTD 类型， 分别表示严格版本、 过渡版本以及基于框架的 HTML 文档。 当浏览器厂商开始创建与标准兼容的浏览器时，他们希望确保向后兼容性。为了实现这一点，他们创 建了两种呈现模式：标准模式和混杂模式（ quirks mode）。在标准模式中，浏览器根据规范呈现页面； 在混杂模式中，页面以一种比较宽松的向后兼容的方式显示。混杂模式通常模拟老式浏览器（比如 Microsoft IE 4 和 Netscape Navigator 4 ）的行为以防止老站点无法工作。 浏览器根据 DOCTYPE是否存在以及使用的哪种 DTD来选择要使用的呈现方法。如果 XHTML文档包含形 式完整的 DOCTYPE，那么它一般以标准模式呈现。对于 HTML 4.01 文档，包含严格 DTD的 DOCTYPE常 常导致页面以标准模式呈现。包含过渡 DTD和 URI 的 DOCTYPE也导致页面以标准模式呈现，但是有过 渡 DTD而没有 URI 会导致页面以混杂模式呈现。 DOCTYPE不存在或形式不正确会导致 HTML和 XHTML文 档以混杂模式呈现。 2. 行内元素有哪些？块级元素有哪些？ CSS的盒模型？ 行内元素有： a b span I b em img input select strong 块级元素有： div ul ol li dl dt dd h1 h2 h3 h4 …p 盒模型： margin border padding width 3. CSS引入的方式有哪些 ? link 和@import 的区别是 ? 1. 使用 LINK 标签 将样式规则写在 .css 的样式文件中，再以 <link> 标签引入。 <link rel=stylesheet type="text/css" href="example.css"> 2. 使用 @import 引入 跟 link 方法很像，但必须放在 <STYLE>...</STYLE> 中 <STYLE TYPE="text/css"> <!-- @import url(css/example.css); --> </STYLE> 3. 使用 STYLE标签 将样式规则写在 <STYLE>...</STYLE> 标签之中。 <STYLE TYPE="text/css"> <!-- body {color: #666;background: #f0f0f0;font-size: 12px;} td,p {color:#c00;font-size: 12px;} --> </STYLE> 4. 使用 STYLE属性 将 STYLE属性直接加在个别的元件标签里， <元件 ( 标签 ) STYLE="性质 ( 属性 )1: 设定值 1; 性质 ( 属性 )2: 设 定值 2; ...} 5. 使用 <span></span> 标记引入样式 <span style="font:12px/20px #000000;"></span> 两者区别： 加载顺序的差别。当一个页面被加载的时候， link 引用的 CSS会同时被加载，而 @import 引用 的 CSS会等到页面全部被下载完再被加载。 @import 可以在 css 中再次引入其他样式表，比如可以创建一 个主样式表，在主样式表中再引入其他的样式表，如：