這次帶給大家2018最新前端面試題,我們知道在前端工作中面試是必不可少的一部分,這次的前端面試常考問題分類整理匯總就是來幫助大家度過前端面試著一大難關。一起來看一下。
【相關推薦:前端面試題(2020)】
一、你最喜歡的圖片替換方法是什麼,你如何選擇使用。
設計師能夠用一張背景圖片取代某元素中的原始文字,以期顯示出更美觀的字體。 實作方法 一:新增span標籤 這個技巧的實作非常簡單:用span將元素中的文本包圍起來,然後透過應用CSS樣式來隱藏這個span中的文本,最後將背景圖像應用到該元素之上即可。例如,對於下面的這一段HTMl標記。 二、負text-indent屬性值 設計師Mike Rundle提出了一種使用負text-indent屬性值的方法,將文字推到螢幕的左邊緣之外。雖然方案的適用性並不廣泛——IE 5.0會將背景圖片隨文字一起推出瀏覽者的視線範圍——但卻相當簡潔優雅。 缺點:並沒有解決瀏覽器禁用圖像後空白頁面的可訪問性問題;有時在IE 5.0中無法使用。
意義:而圖像替換技術則保留了被替換元素中的原有文本,因此無論對何種客戶而言,理解頁面內容都不成問題。主要是考慮SEO,而非視覺上的效果。
二、你會如何解決特定瀏覽器的樣式問題?
所謂的瀏覽器相容性問題,是指因為不同的瀏覽器對同一段程式碼有不同的解析,造成頁面顯示效果不統一的情況。在大多數情況下,我們的需求是,無論使用者使用什麼瀏覽器來查看我們的網站或登陸我們的系統,都應該是統一的顯示效果。所以瀏覽器的相容性問題是前端開發人員常常會碰到和必須要解決的問題。
在學習瀏覽器相容性之前,我想把前端開發人員分成兩類:
第一類是精確按照設計圖開發的前端開發人員,可以說是精確到1px的,他們很容易就會發現設計圖的不足,並且在很少的情況下會碰到瀏覽器的兼容性問題,而這些問題往往都死瀏覽器的bug,並且他們製作的頁面後期易維護,程式碼重用問題少,可以說是比較牢固放心的程式碼。
第二類是基本按照設計圖來開發的前端開發人員,很多細枝末節差距很大,不如間距,行高,圖片位置等等經常會差幾px。某種效果的實現也是反覆調試得到,具體為什麼出現這種效果還模模糊糊,整體佈局十分脆弱。稍有改動就亂七八糟。程式碼為什麼這麼寫還不知所以然。這類開發人員往往經常為相容性問題所困。修改好了這個瀏覽器又亂了另一個瀏覽器。改來改去也毫無頭緒。其實他們碰到的相容性問題大部分不該歸咎於瀏覽器,而是他們的技術本身了。
文章主要針對的是第一類,嚴謹型的開發人員,因此這裡主要從瀏覽器解析差異的角度來分析相容性問題。 (相關文章推薦:主流瀏覽器CSS 3和HTML 5相容清單)
相信看了本文案例你已經掌握了方法,更多精彩請關注php中文網其它相關文章!
相關閱讀:
以上是2018最新前端面試題十二的詳細內容。更多資訊請關注PHP中文網其他相關文章!