如何隐藏图像上的内容？

Question

我正在创建示例代码，并且希望支持HTML和CSS。如何以隐藏顶部和内容的方式实现图像。

这是针对运行HTML5和CSS3的新版Google Chrome

.test1{ 
  position: relative;
  width: 100%;
  float: left; 
  background: #226e7b;
  z-index: 1; 
}

.test2{ 
  position: absolute;
  top: 5%; 
  color: red; 
  border: 1px solid; left: 10%;
} 

img{ 
  width: 20%;
  overflow:
  hidden; height: 
  auto; 
  z-index: 111111; 
}

<div class="test1">
<img src="pic_trulli.jpg" alt="Trulli" width="500" height="333">
<div class="test2">mxvnm vbjz chkdjf gcc bxj ncb mxvnm vbjz chkdjf gcc bxj ncb mxvnm vbjz chkdjf gcc bxj ncb</div>`</div>

我希望输出是图像，内容隐藏。