如何僅使用父元素對HTML進行水平居中？

有沒有辦法通過僅使用父包裝元素來居中一些HTML？父包裝元素不能引用innerHTML的width。我能做到的唯一方法是使用<center>標籤，但正如我們所知，<center>已過時。例如，要center這樣：如何僅使用父元素對HTML進行水平居中？

<div style="width:100px;height:100px;background-color:#ff0000;"></div>

這樣的：

<div style="width:800px;height:100px;background-color:#ff0000;"></div>

這樣的：

<p>a little text here</p>

或本：

<p style="width:400px;">a lot of text here fjskdfj sldjf slkdfj skldjf ksdjf kdsfj ksdjf skdfj ksdjf ksdjf ksdjf ksdjf ksdjf skdjf ksdjf skdfj skdfj ksdjf skdjf ksdjf ksdfj skdfj skdfj skdfj</p>

我可以簡單地用<center>包裝他們，它w獸人。但是還有其他方法可以做到嗎？

來源

2012-07-30 Ryan

與CSS定心

html code: 

<div class="parent"> 
    <div class="center"> 
     <p>A lot of text here</p> 
    </div> 
</div>

CSS代碼：

.parent { 
    width:800px; 
} 

.parent .center { 
    width:400px; 
    margin: 0 auto; 
}

和<div>與center類將在中心對齊。

來源

2012-07-30 23:52:30 Ibu

不是我在找什麼。我想要父元素做中心。在這裏你有內心的元素做中心。當我使用'

'作爲父元素時，它正在進行居中。 – Ryan 2012-07-30 23:58:19

@Ryan這是什麼意思，「父母做中心」。只是試圖將文本居中？ – Ibu 2012-07-31 00:01:59

我想中心任意的HTML只使用父包裝元素做中心。當我使用'

'作爲父包裝元素時，它的工作原理是，我不必在內部元素上使用'margin：0 auto'。它也適用於內聯和塊內容。但有沒有辦法做到這一點，而不使用''？ – Ryan 2012-07-31 00:07:21

定義text-align屬性爲父這樣的：text-align: center;

來源

2012-07-31 00:24:11

您parent元素添加text-align: center。

來源

2012-07-31 00:26:05 ljayz

如何僅使用父元素對HTML進行水平居中？

回答

相關問題