Masking/Clipping div

Question

如何讓div＃1（page-title）通過div＃2（mainwrap）「剪切」並查看背景圖片？

例子：

<div class="body"> 
<div class="mainwrap"> 
<div class="page-title"> 
</div> 
</div> 
</div> 

CSS：

body {background-image: url("/background.jpg");} 
.mainwrap {background: #fff} 
.page-title {background: none;} 

Answer 1

你需要爲使用的位圖圖像或SVG，使你的面具。

.mainwrap將需要應用mask。面具需要是白色背景上的黑色文字（洞）（白色意味着保持）。

請參見：http://www.html5rocks.com/en/tutorials/masking/adobe/