HTML 和 CSS

1. 浏览器的文档模式有哪些,如何开启这些文档模式?

标准模式和怪异模式,省略 标签可以开启怪异模式

2. 常见的块级元素和行内元素有哪些?

块级:div、p、ul、li、dl….

行内:a、span、em、strong….

3. 介绍下 css 盒子模型

padding maring border content 有时会问:IE6-8 对盒子模型渲染和现代浏览器的区别,一直认为没区别,找了些资料说是:IE5 之前会有差异。

4. 请缩写以下代码:

1
2
3
4
5
6
7
.box {
     background-position: 10px 20px;
     background-repeat: no-repeat;
     background-attachment: fixed;
     background-color: red;
     background-image: url(box.png);
}

5. 介绍下你所知道的各种浏览器 hack

IE6_+ IE7+ IE\9 -moz- -ms- -o- -webkit- !imorptant

6. 写出几个 HTML5 新增加标签和新增的 FORM 表单类型

header footer article section aside nav

7. web 标准有哪几部分组成

网页主要由三部分组成:结构(Structure)、表现(Presentation)和行为(Behavior)

8. 写出一个高度为 1px 的 div。

1
2
3
4
5
.div {
heigth: 1px;
font-size: 0;
overflow: hidden;
}

9. 如何让 2 个并列的 div 自动等高(不设高度),随便写出几个,写出思路也可。

答案不限,仅供参考

1
div.parent > div.left + div.right

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
.parent {
overflow: hidden;
}

.left {
float: left;
margin-bottom: -10000px;
padding-bottom: -10000px;
}

.right {
float: left;
margin-bottom: -10000px;
padding-bottom: -10000px;
}

背景平铺模拟法
使用 table, td 是永远等高的

10. 如何使用响应式 web 布局

web 媒体查询 @media query
切图仔必杀技;

11. 你怎么来实现页面设计图,你认为前端应该如何高质量完成工作? 一个满屏 品 字布局 如何设计?

Javascript

1. js 数据结构
种基本数据结构 + 引用类型

2. 简单阐述下 ajax 和前端如何跨域

js 完成 get post 请求, 可同步,可异步

前端对于跨域的解决办法
(1) document.domain+iframe (2) 动态创建 script 标签(jsonp)

3. 如何判断一个 JS 外链已完全加载
只要指出 IE 下和其它现代浏览处理事件的方式不同就行,参考:

IE:onreadystatechange readyState loaded complete
chrome: script 的 load 事件

4. 前端开发的优化

  1. 减少 http 请求次数:css spirit,data uri
  2. JS,CSS 源码压缩
  3. 前端模板 JS+ 数据,减少由于 HTML 标签导致的带宽浪费,前端用变量保存 ajax
  4. css sprite
  5. 减少页面的重排和重绘
  6. 不污染全局变量,少用全局变量
  7. img/js/css 预加载和 img 惰性加载

……. 还有好多。

5. 打印出 1-7 之间的随机数。

6. WEB 应用从服务器主动推送 Data 到客户端有那些方式?

  • html5 websoket
  • WebSocket 通过 Flash
  • XHR 长时间连接
  • XHR Multipart Streaming
  • 不可见的 Iframe

本文地址 https://shaoshilei.com/2014-11/cut-the-tip-face-questions-fig-earners.html