如何使两行文本在图像的右侧中间对齐？
如何使两行文本在图像的右侧中间对齐？
提问于 2018-06-05 07:30:32
伙计们。我正在尝试使用img和两个p来实现这一点：
但我得到的是：
我在下面的代码中做错了什么？请帮帮我!
HTML：
<div class="content-5">
<img src="imagens/joao.png">
<p class="nome">JOÃO SILVA</p>
<p class="casamento">Fotógrafo de casamento</p>
</div>CSS：
.content-5 img {
vertical-align: middle;
display:inline;
margin-left:200px;
}
.nome {
display:inline-block;
font-family: "PFAgoraSansPro-Thin";
font-size:22px;
color:black;
font-weight:bold;
padding-left:30px;
}
.casamento {
display:inline;
font-family: "open sans";
font-size:16px;
color:black;
font-weight:normal;
}回答 1
Stack Overflow用户
发布于 2018-06-05 07:37:35
尝尝这个
<HTML>
<HEAD>
<style>
.content-5 img {
vertical-align: middle;
display:inline;
margin-left:200px;
}
.nome {
display:inline-block;
font-family: "PFAgoraSansPro-Thin";
font-size:22px;
color:black;
font-weight:bold;
padding-left:30px;
}
.casamento {
display:block;
font-family: "open sans";
font-size:16px;
color:black;
font-weight:normal;
}
</style>
</HEAD>
<BODY>
<div class="content-5">
<img src="https://pbs.twimg.com/profile_images/604644048/sign051_400x400.gif">
<p class="nome">JOÃO SILVA</p>
<p class="casamento">Fotógrafo de casamento</p>
</div>
</BODY>
</HTML>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/50690090
复制相关文章
相似问题