2.CSS文字

• 2.1

white-space: pre-line; 強制文字進行換行，前提是在文字中要先在文字中加” \n “，這樣css識別出來在此處進行強制換行。

word-wrap:normal | break-word, break-word可以將內容在邊界內換行（不截斷英文單詞的換行）

word-break:keep-all | break-all當設定keep-all的時候，對於中文文字來說，只可以在半解空格或連字元或任何標點符號的地方換行，中文與中文之間不可以換行，一個長文字也不可以換行。

當設定break-all的時候，主要是在不同的瀏覽器上顯示的效果都不同，因為每個瀏覽器的核心不同，這裡在chrome、safari、Firefox中可以允許標點符號位於首行顯示。

• 2.2
  溢位文字text-overflow
text-overflow: clip | ellipsis有兩個屬性，一個是預設的屬性 clip , 另一個是ellipsis，

如果要實現溢位隱藏，必須滿足3個條件：
- width ：明確給需要擷取文字的容器設定寬度值。
- white-space:nowrap：給文字容器設定強制不換行，讓元素文字一行內顯示。
- over-flow: hidden：設定容器文字溢位時隱藏。
執行上面的屬性條件之後，頁面超出的文字部分將會以...的形式顯示。

• 第1種事件
  $('.XX').click('.xxx',function() { alert('xxx') });
  
  
• 第2種事件
  $('.XXX').on('click','.xxx', function() { alert('xxx') })

click是點選事件，但是在頁面載入完之後，jquery事件新新增的元素，用click的話是無法獲取元素的，這個時候要用on去獲取元素事件，簡單的說頁面載入完成時候頁面顯示的元素可以用on，也可以用click，但是頁面載入完成之後後期再追加的元素只能用on。

這兩個事件的區別之處在於:
簡單的說頁面載入完成時候頁面顯示的元素（DOM節點已全部載入完）可以用 on ， 也可以用click ，

但是在頁面載入完成之後後期再追加元素（DOM節點元素還沒完全顯示出來）

解釋一下：

$('.AAA').on('click','.bbb', function() { alert('bbb') })
獲取class 為bbb元素的上一級（或父級）元素，選擇click的方式，執行回撥函式function ()並執行彈出元素bbb,這裡的on,元素bbb如果沒全部加載出來。沒有直接獲取到class為bbb的元素，這個時候它就會去找上一級（或父級）的元素，然後在從上一級（或父級）往下接著再執行，就會找到class為bbb的元素了，就觸發了點選事件，並執行事件裡面的函式啦 ~