Question

我有一个css标题，不允许我使用相同的行对齐文本。我想这个标题有一个奇怪的默认值，不允许我这样做我如何防止默认或我可以使用其他什么呢？

HTML

h3>Size:</h3>
<?php echo "<span class='sP'>".$pSize ."</span><br>"?>

CSS

h3{
margin-top: 0;
margin-bottom: 0;
color: #7C7C7C;
font-size: 20px;
font-weight: bold;
text-align: left;
font-family: "Lucida Sans Typewriter", "Lucida Console", monaco, "Bitstream Vera Sans Mono", monospace;
}

.sP{
color: #7C7C7C;
font-family: "Lucida Sans Typewriter", "Lucida Console", monaco, "Bitstream Vera Sans Mono", monospace;

}

Answer 1

我认为这将是您正在寻找的答案 - 只需要display:inline-block。我已经提出了一个有效的答案。请试试这个，如果有任何问题请咨询。

＆＃13;

h3{
margin-top: 0;
margin-bottom: 0;
color: #7C7C7C;
font-size: 20px;
font-weight: bold;
text-align: left;
font-family: "Lucida Sans Typewriter", "Lucida Console", monaco, "Bitstream Vera Sans Mono", monospace;
display:inline-block;
}

.sP{
color: #7C7C7C;
font-family: "Lucida Sans Typewriter", "Lucida Console", monaco, "Bitstream Vera Sans Mono", monospace;
display:inline-block;

}

＆＃13;

<h3>Size:</h3>
<span class='sP'>hi</span><br>

＆＃13;

Answer 2

尝试将<span>放入<h3>标记，因为标题占据了整个宽度。

<h3>Size:
   <?php echo "<span class='sP'>".$pSize ."</span><br>"?>
</h3>

Answer 3

标题元素（h1-h6）是块级元素，因此您需要将它们设置为显示：inline-block以显示它们旁边的内容。

＆＃13;

h1 { display: inline-block }
span { display: inline-block }

＆＃13;

<h1>Hello, i'm a big fat heading</h1>
<span>Look at me, i'm a little 'ol span</span>

＆＃13;

标题不允许<span>在同一行中对齐

3 个答案: