【问题标题】:Trying to use the "text-align: center;", works on some text, and doesn't on others尝试使用“text-align:center;”,适用于某些文本,但不适用于其他文本
【发布时间】:2021-01-02 18:29:46
【问题描述】:

正如标题所说,我正在尝试使用“text-align: center;”,但它不适用于特定的文本块。它适用于其他人,所以我对此感到困惑。我是一个完全的菜鸟,哈哈(已经学习了大约 5 天的 HTML 和 CSS),并决定利用我的知识在项目上轻松获得 100 分。请忍受我。这就是导致问题的原因。

CSS:

p4 {
text-align: center;

}

HTML:

<p4>
Over here, we have an economy consisting<br> of mostly fishing, shipbuilding, wheat<br> growing, and fur trapping. There are<br> many different economic opportunities.
</p4>

(对不起,我不知道该放什么,所以你应该看看完整的代码,它在底部附近:https://codepen.io/fishstick_god_/pen/ZEWjLyX

【问题讨论】:

    标签: text-align


    【解决方案1】:

    text-align: center 将文本与元素的中心对齐,在您的情况下,p4 元素不是页面的全宽,因此它仅以内容的宽度为中心。简单的解决方法是将display: block 添加到您的p4

    【讨论】:

    • 成功了!谢谢!
    【解决方案2】:

    p4 不是有效的 HTML 标记,因此浏览器不清楚如何显示它。您应该只使用 p 作为所有段落实例的标签。如果您想对这些段落中的一个段落进行特定的样式设置,并且与其他段落不同,那么还要在标签中包含一个类属性,就像在 HTML 中这样:

    <p class="special">
    

    然后,在 CSS 中,创建一个类选择器,如下所示

    .special { text-align: center; }
    

    您可以将相同的 HTML 类放在任何包含文本的标签(如 p、h1、li 等)上,它会将这些标签居中。 请注意,您不能 text-align: center;任何没有默认显示块的标签,例如 a 标签或 img 标签。此外,您不能使用 text-align: center; 居中结构标签(如 div、header、nav 等)。因为,好吧,它们不是文本。您可以在 CSS 中进行其他选择以使它们居中。

    【讨论】:

      【解决方案3】:

      text-align 适用于所谓的块级元素。喜欢divp。参见,例如,https://developer.mozilla.org/en-US/docs/Web/CSS/text-align

      p4 不符合条件。试试普通的p

      <p style='text-align: center'>Hello World!</p>
      

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2019-05-10
        • 2012-07-28
        • 2011-12-12
        • 1970-01-01
        相关资源
        最近更新 更多