第一篇：web前端面試總結
1.常用那幾種瀏覽器測試？有哪些內核(Layout Engine)?(Q1)瀏覽器：IE，Chrome，FireFox，Safari，Opera。(Q2)內核：Trident，Gecko，Presto，Webkit。
2.說下行內元素和塊級元素的區別？行內塊元素的兼容性使用？（IE8 以下）
(Q1)行內元素：會在水平方向排列，不能包含塊級元素，設置width無效，height無效(可以設置line-height)，margin上下無效，padding上下無效。
塊級元素：各占據一行，垂直方向排列。從新行開始結束接著一個斷行。(Q2)兼容性：display:inline-block;*display:inline;*zoom:1;
3.清除浮動有哪些方式？比較好的方式是哪一種？(Q1)（1）父級div定義height。
（2）結尾處加空div標簽clear:both。（3）父級div定義偽類:after和zoom。（4）父級div定義overflow:hidden。（5）父級div定義overflow:auto。（6）父級div也浮動，需要定義寬度。（7）父級div定義display:table。（8）結尾處加br標簽clear:both。
(Q2)比較好的是第3種方式，好多網站都這么用。
4.box-sizing常用的屬性有哪些？分別有什么作用？(Q1)box-sizing: content-box|border-box|inherit;(Q2)content-box:寬度和高度分別應用到元素的內容框。在寬度和高度之外繪制元素的內邊距和邊框(元素默認效果)。
border-box:元素指定的任何內邊距和邊框都將在已設定的寬度和高度內進行繪制。通過從已設定的寬度和高度分別減去邊框和內邊距才能得到內容的寬度和高度。
5.Doctype作用？標準模式與兼容模式各有什么區別?(Q1)告知瀏覽器的解析器用什么文檔標準解析這個文檔。DOCTYPE不存在或格式不正確會導致文檔以兼容模式呈現。
(Q2)標準模式的排版和JS運作模式都是以該瀏覽器支持的最高標準運行。在兼容模式中，頁面以寬松的向后兼容的方式顯示,模擬老式瀏覽器的行為以防止站點無法工作。
6.HTML5 為什么只需要寫 ？
HTML5不基于 SGML，因此不需要對DTD進行引用，但是需要doctype來規范瀏覽器的行為（讓瀏覽器按照它們應該的方式來運行）。
而HTML4.01基于SGML,所以需要對DTD進行引用，才能告知瀏覽器文檔所使用的文檔類型。
7.頁面導入樣式時，使用link和@import有什么區別？
（1）link屬于XHTML標簽，除了加載CSS外，還能用于定義RSS, 定義rel連接屬性等作用；而@import是CSS提供的，只能用于加載CSS;（2）頁面被加載的時，link會同時被加載，而@import引用的CSS會等到頁面被加載完再加載;（3）import是CSS2.1 提出的，只在IE5以上才能被識別，而link是XHTML標簽，無兼容問題。
8.介紹一下你對瀏覽器內核的理解？
主要分成兩部分：渲染引擎(layout engineer或Rendering Engine)和JS引擎。
渲染引擎：負責取得網頁的內容（HTML、XML、圖像等等）、我們組建一大牛裙前面是4七一，整理訊息（例如加入CSS等），中間是零2七，以及計算網頁的顯示方式，后面是壹武四，是學習的就加，不是學習的請勿打擾。然后會輸出至顯示器或打印機。瀏覽器的內核的不同對于網頁的語法解釋會有不同，所以渲染的效果也不相同。所有網頁瀏覽器、電子郵件客戶端以及其它需要編輯、顯示網絡內容的應用程序都需要內核。JS引擎則：解析和執行javascript來實現網頁的動態效果。
最開始渲染引擎和JS引擎并沒有區分的很明確，后來JS引擎越來越獨立，內核就傾向于只指渲染引擎。
9.html5有哪些新特性？如何處理HTML5新標簽的瀏覽器兼容問題？如何區分 HTML 和 HTML5？(Q1)HTML5 現在已經不是 SGML 的子集，主要是關于圖像，位置，存儲，多任務等功能的增加。
(1)繪畫 canvas;(2)用于媒介回放的 video 和 audio 元素;(3)本地離線存儲 localStorage 長期存儲數據，瀏覽器關閉后數據不丟失;(4)sessionStorage 的數據在瀏覽器關閉后自動刪除;(5)語意化更好的內容元素，比如 article、footer、header、nav、section;(6)表單控件，calendar、date、time、email、url、search;(7)新的技術webworker, websocket, Geolocation;(Q2)IE8/IE7/IE6支持通過document.createElement方法產生的標簽，可以利用這一特性讓這些瀏覽器支持HTML5新標簽，瀏覽器支持新標簽后，還需要添加標簽默認的樣式。當然也可以直接使用成熟的框架、比如html5shim，
10.簡述一下你對HTML語義化的理解？ 用正確的標簽做正確的事情。
html語義化讓頁面的內容結構化，結構更清晰，便于對瀏覽器、搜索引擎解析;即使在沒有樣式CSS情況下也以一種文檔格式顯示，并且是容易閱讀的;搜索引擎的爬蟲也依賴于HTML標記來確定上下文和各個關鍵字的權重，利于SEO;使閱讀源代碼的人對網站更容易將網站分塊，便于閱讀維護理解。
JavaScript----------------------------
1.介紹js的基本數據類型
Undefined、Null、Boolean、Number、String
2.js有哪些內置對象？
數據封裝類對象：Object、Array、Boolean、Number 和 String 其他對象：Function、Arguments、Math、Date、RegExp、Error
3.this對象的理解
this總是指向函數的直接調用者（而非間接調用者）； 如果有new關鍵字，this指向new出來的那個對象；
在事件中，this指向觸發這個事件的對象，特殊的是，IE中的attachEvent中的this總是指向全局對象Window。
4.eval是做什么的？
它的功能是把對應的字符串解析成JS代碼并運行；
應該避免使用eval，不安全，非常耗性能（2次，一次解析成js語句，一次執行）。由JSON字符串轉換為JSON對象的時候可以用eval，var obj =eval('('+ str +')')。
5.DOM怎樣添加、移除、移動、復制、創建和查找節點 // 創建新節點
createDocumentFragment()//創建一個DOM片段 createElement()//創建一個具體的元素 createTextNode()//創建一個文本節點 // 添加、移除、替換、插入 appendChild()removeChild()replaceChild()insertBefore()//在已有的子節點前插入一個新的子節點 // 查找
getElementsByTagName()//通過標簽名稱
getElementsByName()//通過元素的Name屬性的值(IE容錯能力較強，會得到一個數組，其中包括id等于name值的)getElementById()//通過元素Id，唯一性
6.null和undefined的區別？
null是一個表示“無”的對象，轉為數值時為0；undefined是一個表示“無”的原始值，轉為數值時為NaN。undefined：
（1）變量被聲明了，但沒有賦值時，就等于undefined。
（2)調用函數時，應該提供的參數沒有提供，該參數等于undefined。（3）對象沒有賦值的屬性，該屬性的值為undefined。（4）函數沒有返回值時，默認返回undefined。null：
（1）作為函數的參數，表示該函數的參數不是對象。（2）作為對象原型鏈的終點。
7.new操作符具體干了什么呢?（1）創建一個空對象，并且 this 變量引用該對象，同時還繼承了該函數的原型。（2）屬性和方法被加入到 this 引用的對象中。
（3）新創建的對象由 this 所引用，并且最后隱式的返回 this。
8.JSON 的了解？
JSON(JavaScript Object Notation)是一種輕量級的數據交換格式。它是基于JavaScript的一個子集。數據格式簡單, 易于讀寫, 占用帶寬小。格式：采用鍵值對，例如：{'age':'12', 'name':'back'}
9.call()和 apply()的區別和作用？
apply()函數有兩個參數：第一個參數是上下文，第二個參數是參數組成的數組。如果上下文是null，則使用全局對象代替。如：function.apply(this,[1,2,3]);call()的第一個參數是上下文，后續是實例傳入的參數序列。如：function.call(this,1,2,3);
10.如何獲取UA？
function whatBrowser(){
document.Browser.Name.value=navigator.appName;
document.Browser.Version.value=navigator.appVersion;
document.Browser.Code.value=navigator.appCodeName;
document.Browser.Agent.value=navigator.userAgent;
} 其他
----------------------------
1.HTTP狀態碼知道哪些？
Continue 繼續，一般在發送post請求時，已發送了http header之后服務端將返回此信息，表示確認，之后發送具體參數信息 200 OK 正常返回信息
201 Created 請求成功并且服務器創建了新的資源 202 Accepted 服務器已接受請求，但尚未處理
301 Moved Permanently 請求的網頁已永久移動到新位置。302 Found 臨時性重定向。
303 See Other 臨時性重定向，且總是使用 GET 請求新的 URI。304 Not Modified 自從上次請求后，請求的網頁未修改過。400 Bad Request 服務器無法理解請求的格式，客戶端不應當嘗試再次使用相同的內容發起請求。
401 Unauthorized 請求未授權。403 Forbidden 禁止訪問。
404 Not Found 找不到如何與 URI 相匹配的資源。500 Internal Server Error 最常見的服務器端錯誤。
503 Service Unavailable 服務器端暫時無法處理請求（可能是過載或維護）。
2.你有哪些性能優化的方法？
（1）減少http請求次數：CSS Sprites, JS、CSS源碼壓縮、圖片大小控制合適；網頁Gzip，CDN托管，data緩存，圖片服務器。
（2）前端模板 JS+數據，減少由于HTML標簽導致的帶寬浪費，前端用變量保存AJAX請求結果，每次操作本地變量，不用請求，減少請求次數
（3）用innerHTML代替DOM操作，減少DOM操作次數，優化javascript性能。（4）當需要設置的樣式很多時設置className而不是直接操作style。（5）少用全局變量、緩存DOM節點查找的結果。減少IO讀取操作。
（6）避免使用CSS Expression（css表達式)又稱Dynamic properties(動態屬性)。（7）圖片預加載，將樣式表放在頂部，將腳本放在底部 加上時間戳。
3.什么叫優雅降級和漸進增強？
優雅降級：Web站點在所有新式瀏覽器中都能正常工作，如果用戶使用的是老式瀏覽器，則代碼會檢查以確認它們是否能正常工作。由于IE獨特的盒模型布局問題，針對不同版本的IE的hack實踐過優雅降級了,為那些無法支持功能的瀏覽器增加候選方案，使之在舊式瀏覽器上以某種形式降級體驗卻不至于完全失效。漸進增強：從被所有瀏覽器支持的基本功能開始，逐步地添加那些只有新式瀏覽器才支持的功能,向頁面增加無害于基礎瀏覽器的額外樣式和功能的。當瀏覽器支持時，它們會自動地呈現出來并發揮作用。
4.哪些常見操作會造成內存泄漏？
內存泄漏指任何對象在您不再擁有或需要它之后仍然存在。垃圾回收器定期掃描對象，并計算引用了每個對象的其他對象的數量。如果一個對象的引用數量為 0（沒有其他對象引用過該對象），或對該對象的惟一引用是循環的，那么該對象的內存即可回收。
setTimeout 的第一個參數使用字符串而非函數的話，會引發內存泄漏。
閉包、控制臺日志、循環（在兩個對象彼此引用且彼此保留時，就會產生一個循環）。
5.線程與進程的區別
一個程序至少有一個進程,一個進程至少有一個線程。線程的劃分尺度小于進程，使得多線程程序的并發性高。
另外，進程在執行過程中擁有獨立的內存單元，而多個線程共享內存，從而極大地提高了程序的運行效率。
線程在執行過程中與進程還是有區別的。每個獨立的線程有一個程序運行的入口、順序執行序列和程序的出口。但是線程不能夠獨立執行，必須依存在應用程序中，由應用程序提供多個線程執行控制。從邏輯角度來看，多線程的意義在于一個應用程序中，有多個執行部分可以同時執行。但操作系統并沒有將多個線程看做多個獨立的應用，來實現進程的調度和管理以及資源分配。這就是進程和線程的重要區別。
第二篇：web前端個人簡歷
個人簡歷
個人信息
姓名：xxxx 性別：男
出生日期：1993.03 婚姻狀況：未婚 工作所在地：北京 家庭所在地：湖北
聯系電話：18xxxxxx
電子郵箱：xxxxxx@qq.com
專業技能
1、熟練使用Sublime、Photoshop等軟件，掌握網站效果圖的制作、切片以及HTML頁面代碼優化等技術；
2、精通HTML5+CSS3、DIV+CSS等網站前端技術；
3、能夠熟練編寫標準前端代碼，熟悉瀏覽器兼容問題解決方案；
4、熟練掌握javascript語言，精通jQuery庫、bootstrap庫，能夠實現網頁的動態效果與頁面交互；
5、熟練掌握響應式設計，能夠開發移動端頁面；熟練使用swiper手機端應用庫；
6、了解node后臺，熟練掌握Ajax技術；
7、了解gulp自動化構建工具，了解less，echarts圖表庫；
工作經驗
2015.07– 至今 工作職責： 北京第嘉傳媒文化有限公司 職位名稱：前端開發工程師
負責公司產品或項目Web前端開發,根據產品需求和UI效果圖利用sublime編程軟件進行div/css標準網頁制作，Js邏輯設計與開發、jQuery特效編寫以及使用插件實現特效，解決主流瀏覽器兼容性問題，對網站用戶體驗性能進行優化，完成產品前端展示效果和交互功能。
2014.09– 2015.6
工作職責： 秦皇島市金鑾之巔科技開發有限公司
職位名稱：前端開發工程師
負責公司項目的前端修改調試和開發工作，精確的將網站設計圖重構成html 頁面。從ps切圖到div/css標準網頁制作及主流瀏覽器兼容問題的解決，并與后臺緊密配合，確保代碼有效鏈接。
項目經歷： PC端 中國智力運動網
http://www.tmdps.cn）是由泰康人壽保險股份有限公司全資發起成立的大型互聯網保險公司，產品涵蓋意外險、理財險、健康險、旅游險等多種保險。
個人站
kafeihaoka.github.io
教育背景
2011.09-2015.06 燕山大學里仁學院 電子信息工程 本科 求職意向
職位:Web 前端開發 工作地點:北京
第三篇：Web前端工作總結
Web前端學習總結
一.名詞解釋 1.橫切
在固定頁面的寬度(按柵格化進行)并且對高度沒有限制的容器稱為一個標準橫切 2.留白 兩個容器或碎片之間的上、下、左、右的空白距離 3.繼承
元素可以從其父級元素中獲得一些可為自己使用的屬性或值。4.圖片定位
把圖片元素放置到一個靜態的、相對的、絕對的、或固定的位置中，利用CSS中對圖片進行遮罩屬性，多用于頁面中的修飾圖 5.底圖
頁面中在標簽中使用的背景圖 6.齊底(圖)線 用于區分橫切或碎片結束的線或圖 7.頁面結構
頁面的基礎框架，由橫切、布局元素組成 8.焦點區(圖)最易注意的區域 9.導航
在頁面中具有導向性的鏈接集合 10.頭圖 頁面主題圖片 11.間距
碎片或文字間的距離 12.行高
文字段落中行與行之間的距離 13.首行縮進 文字段落首行縮進 14.浮動
使被定義的區域脫離正常的頁面文檔流 15.碎片 由文字、圖片組合成的內容區域 16.通欄廣告 與頁面內容區同寬的廣告區域 17.功能按鈕 具有交互屬性的按鈕 18.私有樣式
當前頁面獨立使用的樣式，不具備公用性 19.水平(垂直)居中
在頁面中的某個元素處于父級的上下或左右的相同距離 20.標準頭(尾)定義相同的頁面頭或尾元素集合 二.文本格式化 1.段落：p 2.斜體：address（聯系信息）em（強調）i（突出不同）cite（引用）dfn（首次定義術語）3.粗體：strong（重要）b（提醒）4.圖片塊：figure 5.引述文段，段落縮進：blockquote 6.背景顏色：mark 7.虛線下劃線：abbr 8.上標下標：sub/sup 9.下劃線：ins 10.刪除線：del（標記已刪除內容）s（標記不準確內容）11.等寬字體：code 12.預格式化：pre 13.字號減小，表注釋：small 14.時間：time 15.換行：br 16.html5定義區塊：header nav article section aside footer div span 三.表單表格
1.
2.表單元素的組織： 3.創建各種框: 注：text→password/url/tel/email Id:為了讓對應的標簽識別，添加CSS Name：為了讓服務器和腳本識別，通常與id設為一樣 Size：文本框大小 Maxlength：能輸入的最大字符數 Pattern：正則表達式4.添加標簽： 5.單(多)選按鈕：
注：id各自唯一，name必須相同。checked：默認選擇 6.下拉框：
注：size:選擇框的高度 multiple：允許多選 selected：默認選擇 用
10.文本區域： 11.表格 :
| .. | .. | |
|---|---|---|
| .. | .. | .. |
1.width：不包括padding，border，margin；max-width設置外圍限制； 2.浮動：float:left;清除浮動：clear:both;3.設置邊框： border:dotted 4px red;(dotted點狀、dashed虛線、solid實線)4.使元素對齊：vertical-align:baseline/middle/text-bottom..5.顯示：display:black/inline/inline-block;6.顯示：visibility:visible/hiddle;7.相對定位：{position:relative;top:5px;} 相對于該元素的原始位置 8.絕對定位：{position:absolute;top:5px;} 相對于body或離他最近定位的祖先元素 9.三維位置：{z-index:50;} 越大的在最上面
10.廠商前綴：-webkit-(safari)–moz-(firefox)–ms-(IE)–o-(opera)11.創建圓角： {-moz-border-radius-topleft:50px;-webkit-border-top-left-radius:50px;border-top-left-radius:50px;}(左上角,角的半徑是50px){border-radius:50px;}(所有角簡寫)12.創建橢圓角：{? ? border-radius:40px/20px;}（x半徑/y半徑）13.創建圓形：{? ? border-radius:50px;} 50px為元素半徑大小 14.文本加陰影：{text-shadow: 2px 5px 5px #999;} x/y/模糊半徑
15.元素加陰影：{(-moz-/-webkit-)box-shadow:(inset內陰影)2px 5px 5px #999;5px 10px 2px #555(多重陰影);} 16.多重背景：{background:#000 url(1.png)50% 102% no-repeat,#222 url(2.png)12px-150px repeat-x;} 17.透明度： {opacity:.5;} 0→1 透明→不透明
18.漸變背景：{background:linear-gradient(left,#000,#999);}(left ：漸變線沿逆時針方向轉至水平線的角度)六.html5視頻音頻
1.html5支持3種視頻：.ogg/.ogv.mp4/.m4v.webm 2.添加視頻： 視頻屬性：src autoplay controls muted loop poster width height preload 3.為視頻添加多個來源： 4.html5支持5中音頻：.ogg.mp3.wav.aac.mp4 5.添加音頻： 音頻屬性：src autoplay controls muted loop preload。多個來源同video。七.一些約定
我們結合常用的一些命名習慣，再結合CSS的實際應用，整理出一些較好的命名習慣。1.樣式名稱首字母統一為小寫字母，不能為數字，下劃線及特殊字符；
3.設置邊框： border:dotted 4px red;(dotted點狀、dashed虛線、solid實線)4.使元素對齊：vertical-align:baseline/middle/text-bottom..5.顯示：display:black/inline/inline-block;6.顯示：visibility:visible/hiddle;7.相對定位：{position:relative;top:5px;} 相對于該元素的原始位置 8.絕對定位：{position:absolute;top:5px;} 相對于body或離他最近定位的祖先元素 9.三維位置：{z-index:50;} 越大的在最上面
10.廠商前綴：-webkit-(safari)–moz-(firefox)–ms-(IE)–o-(opera)11.創建圓角： {-moz-border-radius-topleft:50px;-webkit-border-top-left-radius:50px;border-top-left-radius:50px;}(左上角,角的半徑是50px){border-radius:50px;}(所有角簡寫)12.創建橢圓角：{? ? border-radius:40px/20px;}（x半徑/y半徑）13.創建圓形：{? ? border-radius:50px;} 50px為元素半徑大小 14.文本加陰影：{text-shadow: 2px 5px 5px #999;} x/y/模糊半徑
15.元素加陰影：{(-moz-/-webkit-)box-shadow:(inset內陰影)2px 5px 5px #999;5px 10px 2px #555(多重陰影);} 16.多重背景：{background:#000 url(1.png)50% 102% no-repeat,#222 url(2.png)12px-150px repeat-x;} 17.透明度： {opacity:.5;} 0→1 透明→不透明
18.漸變背景：{background:linear-gradient(left,#000,#999);}(left ：漸變線沿逆時針方向轉至水平線的角度)六.html5視頻音頻
1.html5支持3種視頻：.ogg/.ogv.mp4/.m4v.webm 2.添加視頻： 視頻屬性：src autoplay controls muted loop poster width height preload 3.為視頻添加多個來源： 4.html5支持5中音頻：.ogg.mp3.wav.aac.mp4 5.添加音頻： 音頻屬性：src autoplay controls muted loop preload。多個來源同video。七.一些約定
我們結合常用的一些命名習慣，再結合CSS的實際應用，整理出一些較好的命名習慣。1.樣式名稱首字母統一為小寫字母，不能為數字，下劃線及特殊字符； 2.樣式名盡量語義化或簡寫； 3.樣式名需要組合拼寫時，采用全部小寫拼寫并使用下劃線連接，即：all_keyword； 4.使用px(像素)為基本計量單位； 5.頁面中空格的使用：全角：中文空格 半角；? 6.項目完成包中，文件夾及文件名稱全部采用小寫字母，不使用中文文件名； 7.減少DIV的嵌套層數；
8.給重要圖片加上alt屬性；給重要的元素和截斷的元素加上title； 9.使用正確的注釋方法（詳見“注釋”章節）； 10.特殊情況下要求表現和內容分離，代碼中不要涉及任何表現的元素，例如：style、font 等；
11.雙標記簽都要有開始和結束標簽，單標記標簽的后面一定要加“ /”,例如：
等，并且有正確的層次； 12.其它特殊符號： 1)<(<)2)>(>)八.命名空間
8.1外掛樣式名稱 全局：public.css 全局樣式為全站公用，為頁面樣式基礎，頁面中必須包含。結構：layout.css 頁面結構類型復雜，并且公用類型較多時使用。多用在首頁級頁面和產品類頁面中。私有：style.css 獨立頁面所使用的樣式文件，頁面中必須包含。模塊 module.css 產品類頁面應用，將可復用類模塊進行剝離后，可與其它樣式配合使用。默認 default.css 文章 article.css 圖片 photo.css 下載 soft.css 主題 themes.css 實現換膚功能時應用。補丁 mend.css 基于以上樣式進行的私有化修補。8.2 常用名稱(1)頁面結構 容器: container 頁頭：header 內容：content/container/content(A)頁面主體：main 頁尾：footer 導航：nav 側欄：sidebar 欄目：column 頁面外圍控制整體布局寬度：wrapper 左右中：left right center 浮左浮右：fl fr 清除浮動 clear(2)導航 導航：nav 主導航：mainbav 子導航：subnav 頂導航：topnav 邊導航：sidebar 左導航：leftsidebar 右導航：rightsidebar 菜單：menu 子菜單：submenu 標題：title 摘要：summary 路徑：path(3)模塊化命名 模塊頭部：hd 模塊內容部分：bd 模塊底部：ft(4)各內容頁對應 標題：title 副標題：subtitle 屬性：properties 簡介：infor 內容：content 分頁：page 插入廣告：insert_ad 表情：expression 功能選項：options 上下篇：up_down 評論：comments 相關內容：related 下載地址：download 播放地址：play_add(5)功能 標志：logo 廣告：banner 登陸：login 登錄條：loginbar 注冊：regsiter 搜索：search 日期：date 功能區：shop 標題：title 加入：joinus 狀態：status 按鈕：btn 滾動：scroll 標簽頁：tab 文章列表：list 提示信息：msg 當前的：current 小技巧：tips 圖標：icon 注釋：note 指南：guild 服務：service 熱點：hot 新聞：news 下載：download 投票：vote 合作伙伴：partner 友情鏈接：link 版權：copyright 九.基本設置-public.css 9.1 全局設置
上下邊距(margin、padding)：0(px)左右邊距(margin)：auto(自動)底色(background):#FFF(白色)字體(font-family)、字號(font-szie)、字色(color)：”宋體” 12px #666 代碼： /* 全局CSS定義 */ body{margin:0 auto;padding:0;background:#FFF;color:#666;font:12px ‘宋體';} div,form,ul,ol,li,span,p,dl,dt,dd,img{margin:0;padding:0;border:0;} h1,h2,h3,h4,h5,h6{margin:0;padding:0;font-size:12px;font-weight:normal;} ul,ol,li{list-style:none} table,td,input,textarea{font-size:12px} 9.2 頁面標簽初始化設置 1.常用基本標div,form,ul,ol,li,span,p,dl,dt,dd,img 設置基本標簽的間距、邊框默認值為0。2.h1～h6標題
默認標題內字號12px，內外間距為0px，文字不加粗。3.ul,ol,li 列表 默認不顯示項目符號。4.h2 欄目標題
說明：h2標簽被定義為欄目標題特殊使用，在標簽中非標題文字默認居右顯示，主標題文字使用span標簽包含，居左顯示。5.默認鏈接顏色
常態下不顯示文字下劃線，顏色為灰(#333)，鼠標懸浮時：顯示文字下劃線，顏色變為暗紅(#ccc)。6.狀態：a:link{未點} a:visited{已點} a:focus{鍵盤選中} a:hover{指針停留} a:active{正在點} 9.3 頁面寬度 默認頁面寬(命名規范)：按柵格化進行 9.4.clear 結束容器內各元素的浮動屬性，使相鄰容器或元素節點正常顯示。以下是清除浮動的幾種方法 方法一.clear { clear:both;height:0;font-size:0;line-height:0 } 或.clear { border-top: 1px solid transparent!important;margin-top:-1px!important;border-top: 0px;margin-top: 0px;height: 0px;clear: both;background: none;font-size: 0px;visibility: hidden;} 或.clear{ clear:both;font-size:1px;width:1px;height:0;visibility:hidden;margin-top:0px!important;*margin-top:-1px;line-height:0 } 使用方法:
第四篇：騰訊實習生WEB前端面試經歷
在騰訊面試之前我申請了淘寶的前端，可是筆試就被淘寶鄙視了。這之前還有一個百度內推的，二面已經結束了，不過還真的不知道結果，人家給我答案是這周之內，如果沒有過的話，還有三面，如果過了的話，直接就可以拿offer。
相比之下騰訊是很人性化的，不放過一個有才能的人。
從筆試就可以看出來，我當時網申了，但是沒有申請崗位所以最后只能去霸筆。到了那里以后才發現霸筆的人真的不少啊！筆試完以后晚上就聽說有同學收到面試的通知了，我那個心里著急啊，不過后面一個牛人告訴我說大家都過了，那時候開心啊！然后去網站上查看了一下自己的面試時間和地點，唉那個悲劇啊。我本人做一些兼職給一群中學生上課，每次星期天都要上到下午六點回來，面試時間居然是下午5點，我也顧不了多少了，直接請假，唉！被那個負責人批了一大堆。由于去那里的時候在路上我一直用手機看面經，有時候看著我都想吐了。下午四點多我就帶上了筆記本（這里強調一下，如果是技術的最好帶上自己的作品，那樣可能面試的時候主動權會掌握在自己手里）趕去了華工。
一面
一面的人還真的很多呀，在面試地點看到了很多牛人，比如說我的研究所師兄，我們班的百度牛人。簽到完以后我就走到了一個房間門口，乍一看，哇那么多人在排隊，最后一個MM告訴我她們面試的是產品的，幸好，不然會等死人的。我面試的是前端js，大概5點左右的時候一個gg把我叫了進去，進去以后就感覺一種親切感沒有之前的緊張感，然后面試官叫我等等，估計他還有些事情處理，之后我看到我的筆試成績丟人啊（不好意思說了）！然后面試官叫我自我介紹一下，然后我就balabala的說了一下自己對web開發的興趣以及一些自己開發的項目，然后我就把筆記本帶來的項目一一介紹給他看，似乎他只看我運行的結果。然后就開始問我一些簡歷上的問題.面試官：你講一下你的學生實踐工作吧。然后我就說了一下自己擔任過學生處助理、院的團委副部長，然后就是講了一下自己的學生工作的體驗和感受。
面試官：你有學過數據結構是嗎？那我就問你一些問題。
然后他問了我一些基本的：二叉樹是什么、平衡二叉樹是什么、有哪些排序算法、講解一個你最熟悉的排序算法、還有就是二分查找。
然后我就向面試官借筆，給他說了上面的問題比如說什么是二叉樹等，然后在講解快排的時候我囧了，自己給自己出難題，我列舉了一組數據然后有兩個相同的數字，忽然忘記相同數字怎么處理了，最后我就說去掉相同的，然后給他講解了一下基本思路。他說：嗯嗯，最后就那樣說了一下，這些還是很基本的東東的，最后就沒有問其他方面的問題了，大概整個面試時間為40分鐘，然后我就很安靜的走了。
二面
一直都在等二面，等的我好著急，大概是第二天晚上左右吧，聽到有同學說收到了二面的通知了，我那個心里著急啊，難道又被鄙視了，感覺自己還行的，我就一直等到晚上11點30
左右，看到手機來短信了，一打開那個高興啊（下午17：20華工大學城酒店），然后又是一陣翻看面經。27號我怕路上堵車就早早的到了華工，一直在門口等。在外面的時候偷窺了一下里面，發現那個面試官好嚴，而且一看就是那種技術總監類型的人。門口遇到兩個華工的同學，他們有一個同學被刷了，另外一個同學也來面試前端js方向的，聽他們說我們這個崗位方向的二面的同學只有6個人，頓時感覺壓力好大啊。差不多4：30的時候忽然接到一個網易的電話，叫我去網易大廈筆試，當時看到電話還以為是百度的呢。當時在外面的時候很緊張，剛開始聽里面華工同學介紹還以為這一面不是技術面，不過后面告訴我這就是技術面，而且很嚴格。里面有兩個同學，一個同學在面試，另一個同學一直在寫代碼，似乎他做不出來一直被面試官壓著。5：30左右我進去了，開始很有禮貌的寒暄了幾句。然后他告訴叫我自我介紹一下，這里我就是根據一面的時候的介紹說了大概3分鐘。他就開始問我技術問題了。第一個，PHP是怎么跑起來的。剛開始我那個糾結呀，難道是問我PHP在歷史上是怎么跑起來的？應該不會吧，然后我就問了他說：您說的是PHP是歷史嗎？然后他就說我問的是：如何運行起來的。這下我明白了，我說：通過配置本地服務器apache+wampserver，然后這個問題就大致過了，很囧的是這里的apache讀錯了。第二個問題：你認為java和javascript有什么關系嗎？這些我還是明白的，我說：java和javascript是兩種完全不同的語言，例如javascript數據類型只有number、string、object、array而java就有int、folat等等，javascript是一種web前端開發的腳本語言，與java完全不同。第三個問題：你有一個項目是“中山大學三余社網站”，能不能介紹一下。這個東西，這個項目我還是很清楚的，畢竟這個項目是我和另外兩位大牛做的，然后就balabala的說了一大堆。最后他就要我寫代碼，題目是這樣的，如果有一個雙相鏈表，你如何確認這個雙相鏈表是否斷鏈。對于這個問題我還是真的有些糊涂，然后就問題，斷鏈的意思，是不是說，這個雙相鏈表斷了一條還是兩條都斷，他說：不知道。唉，當時那個囧啊，那只有自己好好想了，開始我認為斷鏈了就很有可能是指向了NULL，所以我分別從左和右遍歷鏈表，找到最后一個指向空的指針，如何是從頭開始遍歷那么最后一個如果不是雙相鏈表的最后一個元素那么就說明斷鏈了，從右邊開始遍歷，如果最后一個指向空的指針不是head那么也是斷鏈了。給他看了代碼以后，他說：你怎么知道，斷鏈了就一定指向空的呢。當時我好糾結啊，最后我想到了，分為三種情況，1，next指針斷開，指向其他指針；2，pre指針斷開指向其他指針；3，next和pre同時斷開。分為這三種情況以后問題就得到解決了。最后就是問了我一個數據庫的問題，他說如果海量數據的時候你應該用什么方法來處理查找的問題。然后我就說：使用hash表存儲。他就說：怎么用hash存儲和查找。我說：使用一種相應的規則定義hash，然后根據輸入插入到數據庫中，查找的時候也使用hash查找。然后他問我：如果遇到hash沖突的話應該怎么辦。我就說：如果兩邊沒有記錄那就插入到兩邊。顯然他對這個不滿意，然后我就說可以再次使用hash，然后他就沒說什么啦。最后他就說：那就這樣吧，你們是不是還有三面的？但是那個心里挺高興的，我說是丫。然后就很安靜的走了出去，第二天下午5點就收到了三面的hr面試通知。
三面
很糾結，三面的前一晚上一直到3點都沒有睡著，早上6點鐘就醒了，不過人還挺精神的。差不多10：20左右到了華工參加三面。三面是HR面試，大家都在想HR會不會刷人，都很擔心，我自己也是非常的擔心。在門口也遇到了很多熟人，比如說嘉聰、沛輪小倆口、二面的一個華工的同學、信科院的一個同學。進去HR面試的同學出來以后都是滿臉的輕松愉快，當時緊張的心里倒也平靜了許多。大概11：00左右吧，兩個面試產品的同學在三面掛了，想參加HR面試，可是前臺簽到的JJ不告訴他們產品的面試地點，當時也覺得他們產
品的真不容易啊，1000多個人筆試只招個位數，那個競爭壓力真大啊。11：30的時候輪到我面試，我進去以后，輕輕的把門關上（這個細節大家以后也稍稍的注意一下，是看以前師兄師姐面經看到的）。之后他同樣讓我自我介紹，我又是根據一面、二面的經驗簡單的介紹了一下。然后他就開始問我，你對騰訊了解多少？我就借用騰訊的Webqq發展過程，簡單說了一下現在的webqq已經深入人心，而且由最初的基本功能上升到現在PC化的web網頁，實在是令web開發的技術人員佩服。他繼續說：你還了解騰訊的哪些產品？我說：騰訊的QQ空間，有一個板塊專門顯示一些和你相識度非常大的用戶，可以很方便的讓用戶聯系到那些同學、朋友，另外一個就是騰訊的輸入法（這個也不是很清楚，只是簡單給他說了一下）等等。他說：你開電腦的第一件事情是干什么？我果斷的說：登qq。HR：你上qq隱身多還是在線多。很果斷的說：隱身多。HR：你上qq都隱身，為什么還要登qq呢。我：首先因為我經常的會使用騰訊的微博，偶爾發一下微博，還有就是經常的會逛逛qq空間，查看一些同學的簽名啊，日志啊，還有就是因為隱身的時候會偶爾有人找我。HR：你是哪里人？我：江西人（很干脆說完了）。HR：那你在大學期間，興趣愛好是什么呢？我：我喜歡玩玩qq游戲（四國軍旗、斗地主）、打籃球、看看格言、聽聽音樂等等。HR：那你為什么要來騰訊呢，是不是騰訊工資很高啊？我：不是的，我主要是想通過實習能夠學會更多的知識，來提高自己的能力，能夠通過在高技術的公司學會更多技術方面的東西。看著他點頭，感覺應該回答的還行。他還問了我一些技術的問題，HR：你是不是開發了一些項目，能簡單介紹一下你們的分工是怎么樣的嗎？我就簡單的介紹了一下。HR：你上網的時候經常做些什么事情呢？我：經常的看一些最近的新聞，比如說qq就會經常的彈出一些最新關注問題，還有就是查看一些資料啊，看一些論壇發布的最新的技術問題。然后大概就是這么多，他還問了我有沒有女朋友，女朋友是干啥的。差不多20分鐘的面試時間吧，感覺總體來說還是比較輕松的，不過在面試的時候最好就是不要說假話，因為HR閱人無數，就不要在他面前顯示什么啦，最好就是有什么說什么。基本上不會問你技術問題，大部分都是一些你的性格愛好，以及對于騰訊的了解之類的問題。
雖然offer還沒有拿到，不過這些天真的很不容易。寫出來只是希望大家以后有個參考，并不是顯擺，說我有多厲害。我們班的牛人是很多，不過我真的不是牛人，我只是菜鳥一個。你們都懂的。
第五篇：web前端開發知識點總結
HTML知識總結
span
行級元素，多個
同行塊級元素，獨占
一行塊級元素，前后
保留一行
標題標簽，h1~h6表6個等級，加粗，前后保留一行width：設置寬
度height：設置高
度alt：圖片加載失敗顯示的文本
div
文本類
p
h
圖片標簽img
color：顏色
水平線常用標簽
hr
size：高度（粗
細）width：寬度（長度）herf：超鏈接轉到的地址
超鏈接a
target
_self:默認值，在當前頁面打開_blank:在新窗口
打開
帶標題的框fieldsetlegend設置標題
disc：實心圓
無序列表
列表標簽
有序列表
ul
square：小方塊
olcircle：空心圓
tr表示行
th
表示標題單元格，居中、加粗
td
表格標簽