分享
三行代码  ›  专栏  ›  技术社区  ›  Zane Hart

尝试使用“text align:center;”对某些文本有效,而对其他文本无效

  •  0
  • Zane Hart  · 技术社区  · 1 周前

    p4 {
    text-align: center;
    

    }

    <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 )

    2 回复  |  直到 1 周前
        1
  •  0
  •   derw    1 周前

    text-align: center 将文本与元素的中心对齐,在您的例子中,p4元素不是页面的全宽,因此它只与内容的宽度居中。简单的解决方法是添加 display: block 给你的 p4

        2
  •  0
  •   Greg Kerr    1 周前

    p4不是有效的HTML标记,因此浏览器不清楚如何显示它。您应该只使用p作为段落的所有实例的标记。如果您希望这些段落中的一个段落的样式与其他段落的样式不同,那么还需要在标记中包含一个class属性,例如在HTML中:

    <p class="special">
    

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

    .special { text-align: center; }
    

    请注意,您不能文本对齐:居中;任何没有默认块显示的标记,如a标记或img标记。另外,不能用text align:center将结构标记(如div、header、nav等)居中;因为它们不是文本。你可以在CSS中做其他的选择来集中它们。