如果被設定元素為文字、等行內元素時，水平居中可以通過父元素設定text-align:center來實現。
html**：
style="text-align:center">我是文字，哈哈，我想要在父容器中水平居中顯示。div>
body>
定寬塊狀元素可以通過設定「左右margin」值為「auto」來實現居中。
html**：
我是定寬塊狀元素，哈哈，我要水平居中顯示。div>
body>
divstyle>
為需要設定的居中的元素外面加入乙個 table 標籤 ( 包括、、)。
為這個 table 設定「左右 margin 居中」（這個和定寬塊狀元素的方法一樣）。
html**：
href="#">1a>
li>
href="#">2a>
li>
href="#">3a>
li>
ul>
td>
tr>
tbody>
table>
div>
table
ulli
style>
這種方法相比第一種方法的優勢是不用增加無語義標籤，簡化了標籤的巢狀深度，但也存在著一些問題：它將塊狀元素的 display 型別改為 inline，變成了行內元素，所以少了一些功能，比如設定長度值。
html**：
class="container">
href="#">1a>
li>
href="#">2a>
li>
href="#">3a>
li>
ul>
div>
body>
.container
.container
ul.container
listyle>
這種方法可以保留塊狀元素仍以 display:block 的形式顯示，優點不新增無語議表標籤，不增加巢狀深度，但它的缺點是設定了 position:relative，帶來了一定的***。
html**：
class="container">
href="#">1a>
li>
href="#">2a>
li>
href="#">3a>
li>
ul>
div>
body>
.container
.container
ul.container
listyle>
CSS水平垂直居中的幾種方法
直接進入主題！css div imghtml 效果圖 當乙個元素絕對定位時，它會根據第乙個不是static定位的祖先元素定位，因此這裡的img根據外層div定位。css container inner html 效果圖 這裡，我們首先用top 50 和left 50 讓inner的座標原點 左上角 ...
CSS水平垂直居中的幾種方法
效果圖 當乙個元素絕對定位時，它會根據第乙個不是static定位的祖先元素定位，因此這裡的img根據外層div定位。css container inner html class container class inner 效果圖 這裡，我們首先用top 50 和left 50 讓inner的座標原點...
CSS水平垂直居中的幾種方法
css div imghtml src prince.png div 效果圖 當乙個元素絕對定位時，它會根據第乙個不是static定位的祖先元素定位，因此這裡的img根據外層div定位。css container inner html class container class inner 效果圖 ...