2019web前端開發全新面試題庫 二

千鋒HTML5學院發表於2019-05-22


  1、為什麼要初始化CSS樣式?

  答案:因為瀏覽器的相容問題,不同瀏覽器對有些標籤的預設值是不同的,如果沒對CSS初始化往往會出現瀏覽器之間的頁面顯示差異。

  當然,初始化樣式會對SEO有一定的影響,但魚和熊掌不可兼得,但力求影響最小的情況下初始化。

  2、浮動元素引起的問題?

  答案:a. 父元素的高度無法被撐開,影響與父元素同級的元素

  b. 與浮動元素同級的非浮動元素會跟隨其後

  c. 若非第一個元素浮動,則該元素之前的元素也需要浮動,否則會影響頁面顯示的結構

  3、line-height三種賦值方式有何區別?(帶單位、純數字、百分比)?

  答案:帶單位:px不用計算,em則會使元素以其父元素font-size值為參考來計算自己的行高

  純數字:把比例傳遞給後代,例如父級行高為1.5,子元素字型為18px,則子元素行高為1.5*18=27px

  百分比:將計算後的值傳遞給後代

  4、 :link、:visited、:hover、:active的執行順序是怎麼樣的?

  答案:L-V-H-A,l(link)ov(visited)e h(hover)a(active)te,即用喜歡和討厭兩個詞來概括

  5、css屬性content有什麼作用?有什麼應用?

  答案:css的content屬性專門應用在 before/after 偽元素上,用於來插入生成內容,可以配合自定義字型顯示特殊符號。

1d5ae42418834e39a9b95818b5b193d0.png

  6、文字超出顯示為省略號?

  答案://單行:

  overflow: hidden;

  text-overflow:ellipsis;

  white-space: nowrap;

  //多行:

  display: -webkit-box;

  -webkit-box-orient: vertical;

  -webkit-line-clamp: 3;

  overflow: hidden;

  7、HTML5有哪些新增的表單元素?

  答案:datalist datetime output date month week time color number range email url

  8、用純CSS建立一個三角形的原理是什麼?

  答案:首先,需要把元素的寬度、高度設為0。然後設定邊框樣式。

  width: 0;

  height: 0;

  border-top: 40px solid transparent;

  border-left: 40px solid transparent;

  border-right: 40px solid transparent;

  border-bottom: 40px solid #ff0000;

  9、什麼時候可以觸發BFC?

  答案:根元素,即html

  float的值不為none(預設)

  overflow的值不為visible(預設)

  display的值為inline-block、table-cell、table-caption

  position的值為absolute或fixed

  10、style標籤寫在body後與body前有什麼區別?

  答案:頁面載入自上而下 當然是先載入樣式。

  寫在body標籤後由於瀏覽器以逐行方式對HTML文件進行解析,當解析到寫在尾部的樣式表(外聯或寫在style標籤)會導致瀏覽器停止之前的渲染,等待載入且解析樣式表完成之後重新渲染,在windows的IE下可能會出現FOUC現象(即樣式失效導致的頁面閃爍問題)


來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/69917019/viewspace-2645239/,如需轉載,請註明出處,否則將追究法律責任。

相關文章