这是 JSFiddle 示例。我想移动 p 标签，使其内联显示在顶部，而不是底部。
<!DOCTYPE html>
<html>
<head>
<style>
div {
display: inline;
}
p {
border-bottom: 6px solid red;
background-color: lightgrey;
padding: 10px;
max-width: 100px;
display: inline-block;
margin-right: 10px;
max-height: 200px;
font-family: "Arial";
}
p:hover {
background-color: #CCCCCC;
cursor: pointer;
}
</style>
</head>
<body>
<div>
<p>This property is a shorthand property for border-bottom-width, border-bottom-style, and border-bottom-color.</p>
<p>This property is a shorthand property for border-bottom-width, border-bottom-style, and border-bottom-color.</p>
<p>This property is a shorthand property for border-bottom-width.</p>
</div>
</body>
</html>
最佳答案
看起来你只是想使用 vertical-align 属性，设置为 top
div {
display: inline;
}
p {
border-bottom: 6px solid red;
background-color: lightgrey;
padding: 10px;
max-width: 100px;
display: inline-block;
margin-right: 10px;
max-height: 250px;
font-family: "Arial";
vertical-align: top;
}
p:hover {
background-color: #CCCCCC;
cursor: pointer;
}<div>
<p>This property is a shorthand property for border-bottom-width, border-bottom-style, and border-bottom-color.</p>
<p>This property is a shorthand property for border-bottom-width, border-bottom-style, and border-bottom-color.</p>
<p>This property is a shorthand property for border-bottom-width.</p>
</div>关于html - 如何将 p 标签的位置向上移动而不是在底部？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/43099620/