前端面试题、知识点整理（笔记一）

好记性不如烂笔头，一些前端的小tips，其实编程，很多时候不会把知识点都面面俱到，要学习的是编程思想，逻辑比较重要，同时养成比较好的编码习惯。面试基础很重要，这篇笔记记载一些前端面试的笔试题。
此为笔记一

下列哪个css属性不可继承（A）
A)height    C)text-align
B)font-size   D)text-indent

CSS中让元素隐藏，但是不清除元素的方法是（B）
A) .element { display: none; }
B) .element { visibility: hidden; }
C) .element { display: block;}
D) .element { visibility: visible; }

注： display和visibility的区别
display会将元素隐藏掉，并且位置不再被占据，而visibility则是占据原来的位置

清除浮动的方法有：给父元素增加高度、overflow:hidden、clear:both

盒子模型的实际宽度包括border-left、padding、content、border-right，是它们的总和

注：盒子模型
CSS盒模型本质上是一个盒子，封装周围的HTML元素，它包括：边距，边框，填充，和实际内容。

总元素的宽度=宽度+左填充+右填充+左边框+右边框+左边距+右边距

总元素的高度=高度+顶部填充+底部填充+上边框+下边框+上边距+下边距
根据 W3C 的规范，元素内容占据的空间是由 width 属性设置的，而内容周围的 padding 和 border 值是另外计算的。不幸的是，IE5.X 和 6 在怪异模式中使用自己的非标准模型。这些浏览器的 width 属性不是内容的宽度，而是内容、内边距和边框的宽度的总和
解决IE8及更早版本不兼容问题可以在HTML页面声明 即可。

在实际开发中，我们定义宽度有时候会使用100%，实现自适应，这个时候，padding，border都属于该元素会比较方便，box-sizing: border-box 可以帮我们解决这个问题，border-box 告诉浏览器去理解你设置的边框和内边距的值是包含在width内的。

background-position主要用来设置背景图片位置。

页面上的定位主要有哪几种，分别是有哪些特点
绝对定位、相对定位、静态定位、固定定位
绝对定位：脱标，子元素相对于父元素左上角进行定位，如果父元素没有设置相对定位，则以浏览器可视区域最上角进行定位
相对定位：相对于元素自身的位置进行定位
静态定位：相当于块级元素
固定定位：脱标，可以一直固定在定位位置上

请简述"margin塌陷现象"的原因，并写出解决办法
答：
①垂直并列（少见）
当两个盒子在垂直方向上设置margin值时，会出现塌陷现象。
上下各自设置外边距
垂直之间塌陷的原则是以两盒子最大的外边距为准
②嵌套关系(常见)
当为子盒子添加margin-top：10px;时会发生如下情况：
子盒子和父盒子之间并没出现期望的10px间隙而是父盒子与子盒子一起与页面顶端产生了10px间隙。
解决方法：
（1）为父盒子设置border，为外层添加border后父子盒子就不是真正意义上的贴合。
（2）为父盒子添加overflow：hidden；
（3）为父盒子设定padding值。

下面标签中不属于html结构标签的是：d
(A) DOCTYPE
(B) html
(C) title
(D) div

下面哪些操作内容可以在html中被有html代码中被识别：A
    (A) 一个空格 
    (B) 一个换行
    (C) 一个缩进 
    (D) 以上都不可以

哪些标签在页面上没有语义的  D
(A) p           (B) h 
(C) input       (D) span

如果希望一行上的文字与图片居中对齐，可以设置哪个属性：C
(A) margin: 0 auto;
(B) text-aline：center
(C) vertical-align: middle
(D) float: left

以下哪些操作不会脱离流B
(A) 浮动
(B) 相对定位
(C) 绝对定位
(D) 固定定位

var str = "11"+2-"1";
console.log(str);
console.log(typeof str);
执行完后str的值为___111____，str的类型为_数字类型______。

请列举出清除浮动的几种方式（最少三种）

Clear：both；

Overflow:hidden;

：after{
clear；both；
Content：0；
Height；0；
Line-height；0；
Disply；block；
Overflow；hidden；
}
.类{zoom;1}

简述您对HTML语义化的理解？
最好用html里面的标签定义。不能使用比如div类的标签定义