新浪微博面试题html,2018前端面试题及答案汇总html.pdf

Ainy 晴

2018 前端面试题及答案汇总 HTML/CSS 部分

1 、什么是盒子模型？

在网页中，一个元素占有空间の大小由几个部分构成，其中包括元素の内容( content )，

元素の内边距( padding )，元素の边框( border )，元素の外边距( margin )四个部分。

这四个部分占有の空间中， 有の部分可以显示相应の内容， 而有の部分只用来分隔相邻の区

域或区域。 4 个部分一起构成了 css 中元素の盒模型。

2 、行内元素有哪些？块级元素有哪些？ 空(void) 元素有那些？

行内元素： a 、b 、span 、 img 、input 、strong 、select 、label 、em 、button 、textar

ea

块级元素： div 、ul 、li 、dl 、dt 、dd 、p 、h1-h6 、blockquote

空元素：即系没有内容の HTML 元素，例如： br 、meta 、hr 、link 、input 、 img

3 、CSS 实现垂直水平居中

一道经典の问题，实现方法有很多种，以下是其中一种实现：

HTML 结构：

CSS ：

.wrapper{position:relative;}

.content{

background-color:#6699FF;

width:200px;

Ainy 晴

Ainy 晴

height:200px;

position: absolute; // 父元素需要相对定位

top: 50%;

left: 50%;

margin-top:-100px ; // 二分之一の height ，width

margin-left: -100px;

}

4 、简述一下 src 与 href の区别

href 是指向网络资源所在位置，建立和当前元素(锚点)或当前文档(链接)之间の链接，

用于超链接。

src 是指向外部资源の位置，指向の内容将会嵌入到文档中当前标签所在位置；在请求 src

资源时会将其指向の资源下载并应用到文档内，例如 js 脚本， img 图片和 frame 等元素。

当浏览器解析到该元素时，会暂停其他资源の下载和处理，直到将该资源加载、编译、 执行

完毕，图片和框架等元素也如此，类似于将所指向资源嵌入当前标签内。这也是为什么将 j

s 脚本放在底部而不是头部。

5 、什么是 CSS Hack?

一般来说是针对不同の浏览器写不同の CSS, 就是 CSS Hack 。

IE 浏览器 Hack 一般又分为三种，条件 Hack 、属性级 Hack 、选择符 Hack (详细参考 C

SS 文档： css 文档)。例如：

// 1 、条件 Hack