尝试了一些与垂直对齐相关的解决方案,但似乎无法解决。不确定是否有人能够帮助我。我想要的只是将替代文本放置在空图像的中间位置。
这是HTML代码:
<div class="viewport">
<a href="#">
<img src="http://yahoo.com/" alt="no image" />
</a>
<div>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
</div>
</div>
这是CSS代码:
.viewport {
background: #bbb;
width: 350px;
height: 300px;
padding: 5px;
}
.viewport img {
float: left;
margin: 5px;
width: 100px;
height: 100px;
background: #000;
text-align: center;
}
.viewport div {
margin-left: 20px;
}
感谢您抽出时间阅读。
(Note:直接翻译成中文后在 HTML 标签前后加上空格)