<分区>
<分区>
我想在图片旁边添加一些文字,但是当我在图片后面放置文字时,它会下降并且不会停留在文章的顶部。
* {
margin: 0;
box-sizing: border-box;
}
* a:link {
text-decoration: none;
}
body {
background-color: #f5f5f5;
height: 100%;
min-height: 100%;
}
article{
background-color: #ffffff;
width: 85%;
padding: 10px 15px;
text-align: right;
direction: rtl;
border-radius: 3px;
margin: 20px auto;
-webkit-box-shadow: 0px 0px 4px -1px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 4px -1px rgba(0,0,0,0.75);
box-shadow: 0px 0px 4px -1px rgba(0,0,0,0.75);
}
img{
border: 1px solid #d9d9d9;
display: inline-block;
}
.name{
display: inline-block;
}
<body>
<article>
<img src="https://sn56.scholastic.com/content/dam/classroom-magazines/sn56/issues/2018-19/040819/picture-this-nature-s-night-light/SN56_040819_Aurora-Hero-Mobile.jpg" width="375" height="375">
<div class="name">text</div>
</article>
</body
我也尝试过使用内联显示,但没有用。
最佳答案
添加 CSS 并在顶部使用垂直对齐属性可能对您有帮助
关于html - 文章底部的文字,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56125856/