适用于使用哈巴狗的任何人

Question

我在对齐两个文本时遇到问题，一个在中心，另一个在右边。

我用Div来对齐它：

<div style="text-align:center">
  <h1> Sample Heading</h1>

    <div style="float:right; text-align:center">

         <a href="#">sample link</a> 

    </div>
</div>

当我使用它时，我的标题是左边的，它不是中心对齐，请告诉这是正确的方法还是有其他方法来处理这种情况。

由于

Answer 1

如果您希望项目不会弄乱布局，请尝试绝对：

<div id="header" style="position:relative;text-align:center;"><!-- define relative so child absolute's are based on this elements origin -->
    <div id="sampleLink" style="position:absolute; top:0px; right:0px; >Link</div>
    <h1 style="text-align:center;">Heading</h1>
</div>

Answer 2

您不需要使用div来执行此操作，您可以自行设置元素的样式。＆lt; a＆gt;默认情况下，tag不理解text-align，因为它是一个内联元素，所以我将链接放在一个段落中，该段落接受text-align。我把两条线放在＆lt; div>标签宽度较小，因此很容易看出发生了什么。

<div style="width:400px;">
  <h1 style="text-align:center"> Sample Heading</h1>
<p  style="text-align:right"><a href="#">sample link</a> </p>
</div>

Answer 3

对我来说很好。但是，如果您对h1的定位存在一些问题，请尝试将其设为阻止：h1 { display: block; }。另一方面，如果您想在同一行显示h1和a，则只需在a之前放置右对齐的h1。

Answer 4

适用于使用哈巴狗的任何人

要快速将链接右对齐，这似乎可行：

html
    head
        style.
            rite {
                font-family: monospace;
                font-size: 10pt;
                text-align: right;
            }

然后...

rite
    p
        a(href='/logout' align=right) logout

请注意，这将无效：

rite a(href='/logout' align=right) logout

这是行不通的：

rite
    a(href='/logout' align=right) logout

如@superUntitled所述。来自@superUntitled的好提示。

如何对齐文本中心和右侧

4 个答案:

适用于使用哈巴狗的任何人