为什么达不到相应的效果

Question

源代码

<figure class="test6">

         <img src="img/52235bf691b05.jpg" />

         <figcaption>

                 <h2>图片标题</h2>

                 <p>图片注释</p>

                 <div>

                         <p>pag1  pag2</p>

                  </div>

        </figcaption>

</figure>

CSS样式

.test6{ background:#410505;

}

.test6 figcaption{ width:100%;

                             height:100%;

}

.test6 figcaption div{ background:white;

                                  width:100%;  

                                  height:80%;

                                  position:absolute; 

                                  top:0;

                                  left:0; 

                                  transform:translate(0px,350px);

}

.test6 figcaption div p{ color:#000;

                                     margin-left:340px;

}

.test6:hover figcaption div{ transform:rotate(-30deg);

                                            transform-origin:0 0;

}

请问代码哪里错误，谢谢

Answer 1

样式不对

Answer 2

就是这种效果

Answer 3

你要的是什么效果？