web前端面試題題目

一.各類瀏覽器兼容的前綴：-o-(Opera)，-ms-(IE)； -moz-(火狐)；-webkit-(chrome)

二.存在兼容性的css屬性：placeholder，主要是由於各類瀏覽器placeholder顏色顯示的不同

三.邊距重疊

  兩個div標籤，垂直排列，上面的margin-bottom:50px,下面的margin-top:20px,那兩個div之間的margin是50px；

  解決途徑：BFC,  

  BFC的原理是：

• 處於同一個BFC中的元素相互影響，可能會發生margin collapse；
• BFC在頁面上是一個獨立的容器，容器裏面的子元素不會影響到外面的元素，反之亦然；
• 計算BFC的高度時，考慮BFC所包含的全部元素，包括浮動元素也參與計算；
• 浮動盒的區域不會疊加到BFC上；

  建立BFC：

• 浮動（float的值不爲none）；
• 絕對定位元素（position的值爲absolute或fixed）；
• 行內塊（display爲inline-block）
• 表格單元（display爲table、table-cell、table-caption等HTML表格相關屬性）；
• 彈性盒（display爲flex或inline-flex）；
• overflow不爲visible；

四.清除浮動原理以及方法

   應用BFC：

   一、父級div定義僞類：after和zoom        

.clearfloat:after{display:block;clear:both;content:"";visibility:hidden;height:0}
 .clearfloat{zoom:1} // 兼容ie7及如下瀏覽器

 2.在結尾處添加空div標籤clear:both

 3.父級div定義height

 4.父級div定義overflow:hidden/overflow:auto

 5.應用BFC原理，設置父元素爲知足上面樣式的BFC元素

五：垂直，水平，垂直水平居中

   1.margin和width

   2.定位加margin

   3.定位加transform

   4.flex佈局：justify-content（水平），align-items(垂直)

六：js面向對象的特徵：封裝，繼承，多態

七：js原型鏈：構造函數，原型對象，實例，構造函數的prototype屬性直接指向原型對象，原型對象的constructor指針指向了構造函數，實例的__proto__指向原型對象

     

八：js設計模式（https://www.cnblogs.com/chenxygx/p/5754101.html）

     1.單例模式；2.工廠模式；3.策略模式；4.觀察者模式（事件流）；5.迭代模式

九：eventloop事件流機制，js是單線程的