背景介紹現在的APP界面中，經常圖象或者視頻上疊加文字和按鈕的情況，比如常見的Banner、查看大圖、視頻播放器、專題等等。

而這也是新人容易出錯的地方：文字直接放在圖片上，當背景色和字色過于接近時，會影響文字的讀取閱讀。比如下面這樣：

為了解決這個問題，通常的解決辦法是在圖片和文字中間疊加一個中間層(蒙層)，如圖：

這樣一來，即便背景色和字色過于接近，由于中間層的存在，也不會影響文字閱讀。

中間層(即 常說的圖片蒙層)的形式大概可分為“全蒙層”和“局部蒙層”兩種：

由于全覆蓋的蒙層對內容品質的影響很大，所以設計師大多采用局部蒙層的設計方案。另外，我們見到絕大多數的局部蒙層方案，已經都采用漸變色。如下圖：

而今天這個被普遍采用的方案，其實也給產品在視覺上造成了不小的瑕疵，下面的文中我將闡述問題形成的原因和解決辦法。

漸變的問題先提一個問題，如果漸變蒙層的參數是 黑色70%不透明度~黑色0%不透明度(#000000, 70% ~ #000000,0% )，參數如下圖所示：

你覺得下面兩張圖，哪張是蒙層效果圖?