如何实现p标签从左边过来
我的弄的是从上面来的，请问怎么弄成从左边过来
<figure class="text1">
<img src="img/04.jpeg"/>
<figcaption>
<h2>图片标题</h2>
<p>图片注解</p>
<p>图片注解</p>
<p>图片注解</p>
</figcaption>
</figure>
*{
margin: 0;
padding: 0;
}
figure{
float: left;
}
figure img {
opacity: 0.8;
transform: all 0.35s;
}
figcaption{
position: absolute;
top: 0;
left: 0;
text-align: center;
}
figcaption p{
transform: all 0.35s;
}
.text1 figcaption p{
background: #fff;
color: #333;
margin: 5px;
padding: 5px;
transform:translate(-120px,0px);
}
.text1 figcaption p:nth-of-type(1){
transition-delay: 0.05s;
}
.text1 figcaption p:nth-of-type(2){
transition-delay: 0.1s;
}
.text1 figcaption p:nth-of-type(3){
transition-delay: 0.15s;
}
.text1:hover figcaption p{
transform:translate(0px,0px);
}
.text1:hover img{
opacity: 1;
}
