1. 單行文本省略問題
大致是有一個 main 容器是 flex 布局，左邊一個 logo 固定寬高，右邊 content 動態寬度。
a namea infoLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
.notice 會非常長，一些設備下需要隱藏顯示，即不換行，并留下省略符 ... 作標記。
.main{display:flex;}.logo{width:100px;height:100px;margin:10px;}.content{flex:1;}.content> *{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
這里會發現text-overflow: ellipsis不生效，省略符根本沒有出現。
嘗試取消父元素 .content 的flex: 1，無效。
嘗試取消 .main 容器的display: flex，省略號出現。
因此猜測是 flex 布局的問題，進一步猜測省略符需要對父元素限定寬度。
嘗試對父元素 .content 設置width: 100%無效，設置width: 0可行。即：
.content{flex:1;width:0;}
2.1 IOS 表單元素點擊自帶背景陰影
最近一直做移動端前端開發，發現一個神奇的東西，對于IOS下的，input或者label元素，
點擊之后，總是會出現一個背景陰影的現象。
之前一直懷疑是Fastclick這個哥們搞的鬼，最后查了fastclick的源碼，fastclick并沒有對它進行過處理，最后發現是IOS系統自帶的背景色。需要消除的話，只需要一行CSS代碼即可：
在你需要消除效果的元素上加上：
//透明度設置為0，去掉點擊鏈接和文本框對象時默認的灰色半透明覆蓋層(iOS)或者虛框(Android)-webkit-tap-highlight-color:rgba(0,0,0,0);
1
2
接下下，一切又恢復了平靜。
