CSS易忽略點：

• 標準盒子模型：盒子的總寬度=左右margin+左右border+左右padding+width
• h1標籤預設情況下，形成“加粗，大號文字”的效果
• html5新增的標籤：article caption video header footer section nav
• H5中場用到的新特行性有：canvas:用於定義圖形（圖表等），只是圖形容器，必須使用指令碼來繪製圖形         audio:用於音訊播放   video：用於視訊播放
• article ：規定獨立的自包含內容  header ：定於文件的頁首       section：定義文件的節    footer：定義文件的頁尾，通常的又文件的作者，版權資訊來呢西方式等
  nav：定義導航連結   表單控制元件有如下：calender   date  time  email url search
• 網頁html文件支援的圖片格式有jpg  gif   png  bmp,前三種的圖片體積小，所佔記憶體小，但bmp格式的比較少見，因為這種格式雖然很清晰，色彩豐富，但是所佔的記憶體很大，但html文件也是支援的。
• 柵格系統會有自動的padding樣式，box-sizing預設為border-box，其字型預設為14px
• css的font-style用於設定字型的風格：分別有標準字型，斜體，傾斜字型和從父級繼承字型
• CSS3新增屬性用法整理：
  1、box-shadow（陰影效果）   2、border-color（為邊框設定多種顏色）      3、border-image（圖片邊框）    4、text-shadow（文字陰影）  5、text-overflow（文字截斷）  6、word-wrap（自動換行）      7、border-radius（圓角邊框）     8、opacity（透明度）   9、box-sizing（控制盒模型的組成模式）10、resize（元素縮放）    11、outline（外邊框）     12、background-size（指定背景圖片尺寸） 13、background-origin（指定背景圖片從哪裡開始顯示）14、background-clip（指定背景圖片從什麼位置開始裁剪）    15、background（為一個元素指定多個背景）    16、hsl（通過色調、飽和度、亮度來指定顏色顏色值）17、hsla（在hsl的基礎上增加透明度設定）   18、rgba（基於rgb設定顏色，a設定透明度）css中可以繼承的屬性很少，只有顏色，文字，字型間距行高對齊方式，和列表的樣式可以繼承
• css中的單位有：% In cm mm em ex pt pc px 顏色有：顏色名  rgb(x,x,x)RGB值  rgb(x%,x%,x%)RGB百分百  #rrggbb十六進位制數
  visibility：hidden可能會發生重繪（repaint） display:none可能會導致渲染（reflow）
• 置換元素：瀏覽器根據元素的標籤和屬性，來決定元素的具體顯示內容。 例如：瀏覽器會根據<img>標籤的src屬性的 值來讀取圖片資訊並顯示出來，而如果檢視(x)html程式碼，則看不到圖片的實際內容；<input>標籤的type屬性來決定是顯示輸入 框，還是單選按鈕等。 (x)html中 的<img>、<input>、<textarea>、<select>、<object> 都是置換元素。這些元素往往沒有實際的內容，即是一個空元素。置換元素在其顯示中生成了框，這也就是有的內聯元素能夠設定寬高的原因。
• 不可替換元素：(x)html 的大多數元素是不可替換元素，即其內容直接表現給使用者端（如瀏覽器）。例如： <label>label中的內容</label> 標籤<label>是一個非置換元素，文字label中的內容”將全被顯示。
• content-box： padding和border不被包含在定義的width和height之內。物件的實際寬度等於設定的width值和border、padding之和，即 ( Element width = width + border + padding ) 此屬性表現為標準模式下的盒模型。 border-box： padding和border被包含在定義的width和height之內。物件的實際寬度就等於設定的width值，即使定義有border和padding也不會改變物件的實際寬度，即 ( Element width = width ) 此屬性表現為怪異模式下的盒模型
• 讓塊元素呈遞為內聯物件的屬性是：display:inline
  display:block就是將元素顯示為塊級元素，一般是其他元素的容器，可容納內聯元素和其他塊狀元素，塊狀元素排斥其他元素與其位於同一行，寬度(width)高度(height)起作用。常見塊狀元素為div和p。
  display:inline就是將元素顯示為內聯元素，內聯元素只能容納文字或者其他內聯元素，它允許其他內聯元素與其位於同一行，但寬度(width)高度(height)不起作用。常見內聯元素為“a”
  display:inline-block將物件呈遞為內聯物件，但是物件的內容作為塊物件呈遞。旁邊的內聯物件會被呈遞在同一行內，允許空格。(準確地說，應用此特性的元素呈現為內聯物件，周圍元素保持在同一行，但可以設定寬度和高度地塊元素的屬性)
• bootstrap中通過向下拉選單新增pull-right類來向右對齊下拉選單，也可以新增dropdown-menu-right類可以讓選單右對齊；bootstrap預設情況下，下拉選單自動沿著父親的上沿河左側被定為為100%寬度；
• 不屬於bootstrap3的標籤有：row-fluid
• 給文字加背景：主要藍（bg-primary），成功綠（bg-success）  資訊藍(bg-info)   警告黃(bg-warning)  危險紅(bg-danger)
• 當margin-top padding-top的值是百分比時，分別是相對最近父級塊級元素的width,相對最近父級塊級元素的width
• 行內塊元素：擁有inline-block屬性（擁有內在尺寸，可設定高寬，不會自動換行）
               典型的標籤有：input textarea object img select

HTML易忽略點：

•   行內元素有：a b span img input select strong 
•   塊級元素有：div ul ol li dl dt dd h1 h2 h3 h4…p
•   常見的空元素：<br> <hr> <img> <input> <link> <meta>
•   鮮為人知的是<area> <base> <col> <command> <embed> <keygen> <param> <source> <track> <wbr>
• html中，可以直接在網頁上通過連結直接開啟郵件客戶端傳送郵件：<a href="mailto:[email protected]">傳送郵件</a>  mailto後為收件人地址
• 在html中避免使用<font>標籤，建議使用css樣式代替<font>標籤來定義文字的字型，字型顏色，字型尺寸
• 對form表單中的input元素的readonly與disabled屬性描述：
  disabled和readonly這兩個屬性有一些共同之處，比如都設為true，則form屬性將不能被編輯，往往在寫js程式碼的時候容易混合使用這兩個屬性，其實他們之間是有一定區別的：
  如果一個輸入項的disabled設為true，則該表單輸入項不能獲取焦點，使用者的所有操作（滑鼠點選和鍵盤輸入等）對該輸入項都無效，最重要的一點是當提交表單時，這個表單輸入項將不會被提交。而readonly只是針對文字輸入框這類可以輸入文字的輸入項，如果設為true，使用者只是不能編輯對應的文字，但是仍然可以聚焦焦點，並且在提交表單的時候，該輸入項會作為form的一項提交
• 如果一個html文件中包含阿拉伯文，則應該使用utf8編碼
• ul無序列表 dl定義列表  li專案列表  ol有序列表
• html5不再支援的標籤有font,css3動畫需要運用keyframes規則
• label標籤只有兩個屬性：for規定label繫結到哪個表單元素上   form規定label欄位所屬的一個或多個表單
• 螢幕尺寸：
  col-xs:<768   col-sm>=768      col-md>=992             col-lg>=1200

部分程式碼原理：

• 在使用table表現資料時，有時候表現出來的會比自己實際設定的寬度要寬，為此應該設定cellpadding="0"和cellspacing="0"這兩個來消除這種現象
• window.onload = function(){ //首先獲得下拉框的節點物件； var obj = document.getElementById(&quot;obj&quot;); //1.如何獲得當前選中的值？： var value = obj.value; //2.如何獲得該下拉框所有的option的節點物件 var options = obj.options; //注意：得到的options是一個物件陣列 //3.如何獲得第幾個option的value值?比如我要獲取第一option的value,可以這樣： var value1 =options[0].value; //4.如何獲得第幾個option的文字內容?比如我要獲取第一option的文字,可以這樣： var text1 = options[0].text; //5.如何獲得當前選中的option的索引？ var index = obj.selectedIndex; //6.如何獲得當前選中的option的文字內容？ //從第2個問題，我們已經獲得所有的option的物件陣列options了 //又從第5個問題，我們獲取到了當前選中的option的索引值 //所以我們只要同options[index]下標的方法得到當前選中的option了 var selectedText =options[index].text; }
• Flexbox可以簡單快速的建立一個具有彈性功能的佈局，當在一個小螢幕上顯示的時候，Flexbox可以讓元素在容器(伸縮容器)中進行自由擴充套件和收縮，從而容易調整整個佈局。它的目的是使用常見的佈局模式，比如說三列布局，可以非常簡單的實現。
  一個Flexbox佈局是由一個伸縮容器(flex containers)和在這個容器裡的伸縮專案(flex items)組成。 伸縮容器(flex  containers)是一個HTML標籤元素，並且“display”屬性顯式的設定了“flex”屬性值。在伸縮容器中的所有子元素都會自動變成伸縮專案(flex  items)。
• 在不涉及樣式的情況下，頁面元素是“從上往下”解析的，因此與結構排放順序有關
• 如果一個html檔案中存在兩個外部引用的樣式檔案，則在頁面載入的時候兩個檔案是同時開始載入的，先載入完成的優先解析，如果後者和前者有相同的選擇器規則，則後者中的規則將合併前者中的規則
• Internet Explorer 9+ 支援 border-radius 和 box-shadow 屬性。
  Firefox 、 Chrome 以及 Safari 支援所有新的邊框屬性。
  註釋：對於 border-image ， Safari 5 以及更老的版本需要字首 -webkit- 。
  Opera 支援 border-radius 和 box-shadow 屬性，但是對於 border-image 需要字首 -o-
• Bootstrap 框架的網格系統工作原理如下：
    1 、資料行 (.row) 必須包含在容器（ .container ）中，以便為其賦予合適的對齊方式和內   距 (padding) 。
    2 、在行 (.row) 中可以新增列 (.column) ，但列數之和不能超過平分的總列數，比如 12 
    3 、具體內容應當放置在列容器（ column ）之內，而且只有列（ column ）才可以作為行容器 (.row) 的直接子元素
    4 、通過設定內距（ padding ）從而建立列與列之間的間距。然後通過為第一列和最後一列設定負值的外距（ margin ）來抵消內距(padding) 的影響
• 瀏覽器端的儲存技術有：cookie webStorage(localStrage,sessionStorage)  userData indexedDB   而伺服器端的技術有session
• web worker是後臺執行的程式，執行在後臺的javascrpit程式，不會影響頁面的效能，比如一個計算題，後臺在計算，再給頁面賦值，但在計算的這段時間內，頁面也可以做其他的事情。
• Ajax支援的資料型別有：xml  html script json jsonp text
• 網頁的最上層的標題應該使用title，文章的最上層的標題是h1,還有一般的網頁設計中，logo部分會由h1標籤組成。
• 當一個元素被巢狀在多重標籤內時，要判斷優先順序，可以採用給不用的選擇器設定權重，比如標籤的權重是1，類的權重是10，id的權重是100，再根據css中對目標元素的設定，比較權重
  ul#related span的權重為：1+100+1=102    #favorite.highlight的權重為：100+10=110 .highlight權重為10，所以三者最高的權重為110，目標應該是服從第二種的樣式
• 關於Ajax和Flash的優缺點：
  Ajax的優勢：可搜尋性；開發性；費用；易用性；易於開發
  flash的優勢：多媒體處理；相容性；向量圖形；客戶端資源排程
  Ajax劣勢：可能搞破壞瀏覽器的後退功能；使用動態頁面更新使得使用者難於將某個特定的狀態儲存到收臧夾中
  flash劣勢：二進位制格式；格式私有；檔案經常會很大，第一次使用需要較長的等待時間；效能問題
• head部分裡的javaScript會在被呼叫的時候執行；body部分中的javascript會在頁面載入的時候被執行
• 關於web表單登陸中用到的圖形驗證碼的實現：伺服器端生成驗證碼後一方面通過圖片將驗證碼返回給客戶端，同時在伺服器端儲存文字的驗證碼，由伺服器端驗證輸入內容是否正確
• iframe的使用場景有：與第三方域名下的頁面共享cookie；上傳圖片，避免當前頁重新整理；左邊固定右邊自適應的佈局；資源載入
• 瀏覽器核心與瀏覽器對應關係：
  Trident:IE
  Gecko:Firefox
  Webkit:safari Google 傲遊 獵豹 百度 opera
  Presto:opera
• Http協議特點：無連線，媒體獨立，無狀態，基於TCP/IP通訊協議來傳遞資料，基於客戶端/服務端架構模型
  Restful介面中，利用http協議的method欄位來描述要資源操作的方式，比如GET白哦書獲取資源， POST也是新增一個資源 PUT表示更新資源 DELETE表示刪除資源等