Image 将figcaption垂直居中放置在图像旁边?
我在Image 将figcaption垂直居中放置在图像旁边?,image,figure,caption,Image,Figure,Caption,我在图标记中有一个图像和一个标题。我想知道如何将figcaption定位在img旁边并垂直居中,如所附图像 这是我设置的一个 谢谢大家! 在这里,只需将css替换为以下内容: html { font-family: 'Helvetica-Neue', Arial, Helvetica; font-size: 1em; line-height: 1.4; letter-spacing: 1px; color:white; } figure { float:left; padding:20px;
图
标记中有一个图像和一个标题。我想知道如何将figcaption
定位在img
旁边并垂直居中,如所附图像
这是我设置的一个
谢谢大家! 在这里,只需将css替换为以下内容:
html { font-family: 'Helvetica-Neue', Arial, Helvetica; font-size: 1em; line-height: 1.4; letter-spacing: 1px; color:white; }
figure { float:left; padding:20px; display:block; background:#ffa2df; position:relative; }
.width { width:50%; }
.height { height:15em; }
img { width:auto; height:100%; float:left;}
figcaption { background:#5800ff; height:100%; display:flex; justify-content: center;
flex-direction: column;
text-align: center;
float:left;
}
谢谢,但不太好!图像的宽度需要设置为“自动”。不管怎样,这仍然有效?是的,我刚刚修改了我的答案。